vue之$children和$parent, provide和inject用法以及使用style的方式 显示背景图片

1.使用$parent可以获取父组件没传的属性和方法

第一步:父组件定义一个数据

第一步

第二步:

第二步.使用$children可以获取子组件没传的属性和方法

$parent和$children的区别是$parent方法在created里调用,$children方法在mounted里调用

2.通过 provide和inject可以父传子也可以爷爷传孙子  可以向下传递,不可以兄弟之间传值,兄弟传值建议使用事件总线的方式

注意:provide/inject可实现跨组件传值,数据的流只能是向下传递,其中父组件provide,子组件inject。provide : 必须在父组件进行使用,用来给后代组件注入依赖

(属性或方法)inject :  必须

在子组件进行使用,用来获取根组件定义的要跨组件传递的数据

基本传值方式

第一步:

第二步:

第三步:验证子传父不成功,会进行报错

第四步:如果父级组件的值是动态从接口中获取的,需要把provide改成函数的形式,数据以函数的形式返回

第五步:儿子也可以使用爷爷传的内容

3.在Vue脚手架中使用style的方式  显示背景图片

你可能感兴趣的:(vue之$children和$parent, provide和inject用法以及使用style的方式 显示背景图片)