Vue

1.组件
全局组件注册、局部组件注册、父子双向传递值、动态组件、slot内容分发、data、$refs
(1)配置子组件
components:{ "my-component3":{ template:"

这是子组件

" } }

var myComponent4 = Vue.extend({
        template :`
 第四个组件{{msg}} 
`
    })

(2)在vue中组件的作用域是隔离的，如果想要在子组件中访问父级的数据，则需要父级显式的向下传递

为了解决地址传递的问题，在组件中声明data必须为函数
且返回一个新对象，这样每个组件用到的data是一块新的内存地址，组件间互不影响

                   return {
                       num:0
                   }
                }```
`data:{ num:0 }`
如果需要获取dom元素，可将元素以 ref ="name" 进行标识
通过this.$refs.name 得到对应的name的dom,尽量少用
`  this.$refs.mi.focus();`

（3）组件动态切换
通过component声明动态组件，绑定is决定渲染哪个子组件，is所绑定的值，必须在component中主页
通过keep-alive标签包裹 component 标签，使组件保留在内存中，重新切换时，将不再重新渲染
        在1.x版本中，keep-alive是component的一个属性

首页
购物车
个人中心

---

var vm = new Vue({
el: ".box",
data: {
currentView : "home"
},
components: {
home : {
template :

首页{{d}}

,
data :function(){
return {
d:new Date().getTime()
}
}
},
cart : {
template :

购物车

},
mine : {
template :

个人中心

}
},
methods:{

    }
})

(4)slot
``插槽（内容分发）
有name属性的标签叫 具名插槽  ``
没有name属性的标签叫 匿名插槽
在组件渲染模板时，会抛弃标签内的原始内容，为了保留原始内容，可以在 模板 内通过 slot 标签预留插槽位
原始内容（不含slot属性的）会默认放到匿名的插槽内
含有slot属性的，会去查找对应的插槽，未找到，将抛弃内容