相信很多初学Vue的小伙伴都有一个疑惑,为什么使用Vue所制作的网页是单页面的呢?下面我们一起来探讨一下这个问题。

        我们都知道Vue的工作就是将我们的数据渲染到页面上。想要在模板上渲染数据,首先就要把Vue的实例对象挂载到模板上,下面我们就以一个使用vue-cli创建的项目来讲解:

首先我们点开 src/mian.js 文件:

 

        可以看到vue-cli首先是帮我们引入了vue和App组件,通过new Vue建立了一个Vue的实例对象,然后就通过$mount方法将这个Vue实例挂载到了一个 id 名为 app 的标签上,然后通过render函数将App组件插入到了这个标签内。

那么这个 id 名为 app 的标签在哪呢?我们进入到 public/index.html 文件:

 

        可以发现这个 id 名为 app 的标签是一个 html 里面的一个 div 标签。这说明我们在 App组件 内写的代码都会汇集到这个 index.html 文件内,而我们写的 Component组件 都由这个App组件所管理,所以说我们写所有代码最终都会汇集到这一个 HTML文件中。

        这就是为什么说Vue写的网页都是单页面的。

        我们平常看到的页面跳转其实大多数都是后端路由,而我们在Vue中写的路由是属于前端路由,是用于实现组件间跳转的。后端路由在跳转时会向服务器发送请求,而前端路由则不会向服务器发送请求。

Logo

前往低代码交流专区

更多推荐