网站建设费用不用摊销,互联网推广项目,建设网络平台,html5网站欣赏当不使用Vuex的前提下#xff0c;子孙传递就得使用另外一种办法#xff1a;provide 和 inject 总结#xff1a;provide / inject 类似于消息的订阅和发布。- inject接收数据。- provide提供或发送数据#xff0c;#xff08;1#xff09;provide#xff08;name#xf…当不使用Vuex的前提下子孙传递就得使用另外一种办法provide 和 inject 总结provide / inject 类似于消息的订阅和发布。 - inject接收数据。 - provide提供或发送数据 1providenamevalue函数接收两个参数 name定义提供 property的name。 valueproperty的值。2injectnamedefault函数有两个参数 name接收 provide 提供的属性名。 default设置默认值可以不写是可选参数示例A组件templatedivh3A组件/h3input typetext v-modelwordbrhrbrother/brotherbr/div
/templatescript
import brother from ../test/brother.vue
export default {components:{brother,},data(){return{word:123}},provide:function(){return {Message:()this.word}}
}
/scriptstyle/style注意在这里须注意的是当祖先传入给子孙的是一个对象则provide返回的是一个对象当祖先传入的不是一个对象时则provide返回的是一个函数。B组件templatedivC组件:{{ getFather }}{{ mes }}/div
/templatescript
export default {data(){return {mes:}},inject:[Message],computed:{getFather(){return this.Message()}}
}
/scriptstyle/style注意子孙组件通过inject进行接收然后通过computed属性将接收到的值返回。这里不一定使用computed属性其他属性也可以因为inject里面的数据即为祖先组件传递的值。