1.main.js
1 import Vue from 'vue' 2 import App from './App'
3 //根实例 4 new Vue({ 5 //挂载到index.html的<div id="app"> 6 el: '#app', 7 //router对象,包含路由信息 8 router, 9 //在该根实例中注册App.vue中的App组件 10 components: {"App": App}, 11 //模版,vue文档中说是会使用template来替换被挂载的节点,也就是 index.html 的<div id="app"> 13 template: '<App/>' 14 })
2.App.vue
<template> <div id="app" v-cloak> <!--被匹配成功的组件将会被渲染到这里--> <router-view/> </div> </template> <script> export default { name: 'App' } </script>
3.index.html
<html> <body> <!--被main.js挂载的标签--> <div id="app"></div> </body> </html>
说明:main.js中的根实例会挂载到index.html中的<div id="app">,且用template替换,即替换为<App></App>. 由于根实例注册了App组件,所以这标签就是App.vue组件。由于App.vue中含有<router-view/>,所以路由匹配成功的页面都在这里进行渲染和切换。
---------------------
作者:转的你死
来源:CSDN
原文:https://blog.csdn.net/a493556721/article/details/81979558
版权声明:本文为博主原创文章,转载请附上博文链接!