学习总结

组件化开发
组件化规范：Web Components
全局组件注册语法：
Vue.component( 组件名称,{
data:组件数据,
template:组件模板内容
})
注意点：data必须是一个函数,使用函数会形成一个闭包的环境，让每个闭包都是独立的数据
组件模板内容必须是单个根元素
组件模板内容可以是模板字符串（需要es6兼容）

​ 组件命名方式
​ 短横线方式
​ Vue.component('my-component',{....})
​ 驼峰方式
​ Vue.component('MyComponent',{....})
​ 如果使用驼峰式命名组件，在使用组件的时候，只能在字符串模板中用驼峰式使用，但是在普通标签中必须使用短横线的方式使用组件。
​ 局部组件注册：
​ var ComponentA = {....}
​ var ComponentB = {....}
​ var ComponentC = {....}
​ new Vue({
​ el:"#app",
​ components:{
​ 'component-a':ComponentA,
​ 'component-b':ComponentB,
​ 'component-c':ComponentC,
​ }
​ })
​

​ 组件之间的数据交互
​ 一.父组件向子组件传值
​ 1.组件内部通过props接收传递过来的值
​ Vue.component('menu-item',{
​ props:['title'],
​ template:'

'
​ })
​ 2.父组件通过属性将值传递给子组件
​ (写死的)
​ (动态的)
​ props属性名规则
​ 在props中使用驼峰形式，模板中需要使用短横线的形式
​ 字符串形式的模板中没有这个限制
​ Vue.component('menu-item',{
​ props:['menuTitle'],
​ template:'

'
​ })
​ ​

​ props属性值类型
​ 字符串String
​ 数值Number 必须用:不然类型是字符串
​ 布尔值Boolean 必须用:不然类型是字符串
​ 数组Array 必须用:
​ 对象Object 必须用:
​ props传递数组原则，单向数据

​

​ 子组件像父组件传值
​ 1.子组件通过自定义事件向父组件传递信息
​ 扩大字体
​ 2.父组件监听子组件的事件
​ ​

​ 3.子组件通过自定义事件向父组件传递信息
​ 扩大字体
​ 4.父组件监听子组件的事件
​

学习心得

感觉状态或者什么的都挺好的，近期有一些对前面知识的巩固，也有学习了后面再反推前面知识带来更深一步的理解，感觉很不错。