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

Posted 2023-03-31

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

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

第二步：

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

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

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

（属性或方法）inject :  必须

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

基本传值方式

第一步：

第二步：

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

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

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

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