也就是props是子组件访问父组件数据的唯一接口。父组件的数据需要通过prop才能下发到子组件中。不能在子组件的模板内直接引用父组件的数据。
基本用法
- <divid="app1">
- <child:hello='hello'>child>
- div>
- <script>
- varcom1=Vue.component('child',{
- //声明在prop中的变量可以引用父元素的数据
- props:['hello'],
- //这里渲染props中声明的那个hello
- template:'<div><p>{{hello}}p>div>',
- })
- varapp1=newVue({
- el:'#app1',
- data:{
- greet:{
- hello:'hello,',
- world:'world',
- },
- message:'message1',
- }
- })
- script>
Vue props用法详解
组件接受的选项之一 props 是 Vue 中非常重要的一个选项。父子组件的关系可以总结为：
props down,events up
父组件通过 props 向下传递数据给子组件;子组件通过 events 给父组件发送消息。
温馨提示：
微信扫码关注公众号
获取更多考试热门资料
