组件component的写法有全局写法和局部写法，全局写法在所有vue实例中都可用，局部写在一个vue实例里面
全局写法：
<root></root>
Vue.component('root',{template:'<div>全局全局</div>'})
这样我们就把就定义了一歌全局组件,root,直接使用<root>标签调用，就把组件中的template模板内容渲染到<root></root>标签里了！
局部写法：
<root></root>
var vm=new Vue({
el:'实例名',
components:{
root:{template:'<div>局部局部</div>'}
}
})
有时候我们不想用脚手架，用cdn引入方式路由怎么写呢？
首先引入JS
<script src="https://cdn.staticfile.org/vue/2.4.2/vue.min.js"></script>
<script src="https://cdn.staticfile.org/vue-router/2.7.0/vue-router.min.js"></script>
然后html页面
<div id="app">
<!– 路由入口 –>
<router-link to="/foo">Go to Foo</router-link>
<router-link to="/bar">Go to Bar</router-link>
<!– 路由出口 –>
<!– 路由匹配到的组件将渲染在这里 –>
<router-view></router-view>
</div>
然后js页面
const app = new Vue({
el:"#app",
router:new VueRouter({
routes:[
{path:'/foo',component:{template:"<div>foo</div>"}},
{path:'/bar',component:{template:"<div>bar</div>"}}
]
})
})
在vue实例中定义router属性，属性的值是new VueRouter(), new VueRouter({})的参数是对象，里面有个routers属性，routers属性是一个数组，数组中的每一个都是对象，对象中有path属性指定路径，component和路径绑定的组件，组件中有template模板属性！
原文链接：https://blog.csdn.net/qq_40999917/article/details/121979204?ops_request_misc=%257B%2522request%255Fid%2522%253A%2522165918321816781667824586%2522%252C%2522scm%2522%253A%252220140713.130102334.pc%255Fblog.%2522%257D&request_id=165918321816781667824586&biz_id=0&utm_medium=distribute.pc_search_result.none-task-blog-2~blog~first_rank_ecpm_v1~times_rank-22-121979204-null-null.nonecase&utm_term=cdn
原创文章，作者：优速盾-小U，如若转载，请注明出处：https://www.cdnb.net/bbs/archives/246
