Vuejs 0.12.x学习笔记——组件中数据继承

Vuejs 0.12.x 在组件系统的Api上有些变化，首先是v-with 这个指令没有了，取而代之的是需要通过props来向子组件传递父组件或ViewModel的数据，例如:

通过直接在标签上添加属性，在Mustache标签里添加父ViewModel的数据，在子组件props数组当中加入标签上属性的名字来继承数据，注意当标签属性名当中出现了’-‘时，在props里要写成驼峰的形式并且在使用这个数据的地方都要写成驼峰模式。在props当中出现的名字会被添加到数据上

#####上面的props的类型是数组，下面会说明props为对象时的情况

var vm=new Vue({ el:'#component-demo', data:{ 'title':'', 'userProfile':'dp' }, components:{ 'user-profile':{ template:'

{{title}}

{{userProfile}}

', props:{ title:{ type:String } } } } });

props 的title 属性，键名就是从父类继承的数据的名称，title的值是一个对象，里面的type 属性值为String 这表示子组件上的title数据只能从父类继承String 类型的数据，
当父ViewModel设置的title数据类型与子组件所规定的不符，则子组件的title不会被设置。

以下下几点要注意:

• 当在标签上加上title属性后,如果父ViewModel初始化的title的数据类型与子组件title不符，那么子组件此时不会有title这个数据存在。
• 当标签上无title属性时，如果props对象里或当props数组里有title，此时在子组件上会有title数据，不会受父级影响
• 对于子组件设置title是不受类型约束的。