vue 组件和路由 cdn引入方式的写法。。。。

组件component的写法有全局写法和局部写法,全局写法在所有vue实例中都可用,局部写在一个vue实例里面

全局写法:

Vue.component('root',{template:'
全局全局
'})

这样我们就把就定义了一歌全局组件,root,直接使用标签调用,就把组件中的template模板内容渲染到标签里了!

局部写法:

var vm=new Vue({
    el:'实例名',
    components:{
       root:{template:'
局部局部
'} } })

有时候我们不想用脚手架,用cdn引入方式路由怎么写呢?

首先引入JS


然后html页面

Go to Foo Go to Bar

然后js页面

const app = new Vue({
	el:"#app",
    router:new VueRouter({
  	    routes:[
                {path:'/foo',component:{template:"
foo
"}}, {path:'/bar',component:{template:"
bar
"}} ] }) })

在vue实例中定义router属性,属性的值是new VueRouter(), new VueRouter({})的参数是对象,里面有个routers属性,routers属性是一个数组,数组中的每一个都是对象,对象中有path属性指定路径,component和路径绑定的组件,组件中有template模板属性!

你可能感兴趣的:(vue)