当前位置: 代码迷 >> 综合 >> vue slot 插槽隔代传数据 作用域篇 (vue2.6)
  详细解决方案

vue slot 插槽隔代传数据 作用域篇 (vue2.6)

热度:70   发布时间:2023-10-14 04:57:16.0

上篇介绍插槽从父级传插槽数据到子级的子级

vue slot 插槽隔代传数据(vue2.6)https://blog.csdn.net/qq_34685515/article/details/120582088?spm=1001.2014.3001.5501vue slot 插槽隔代传数据 作用域篇 (vue2.6)https://blog.csdn.net/qq_34685515/article/details/120582088?spm=1001.2014.3001.5501下面介绍反向 由孙级 传数据到父级

父级写法 解构写法

<template><div><test1><template v-slot:content="{ time }"> {
   { time }}子组件返回 </template></test1></div>
</template>

子组件写法 

<template><div><test2><template v-slot:content="{ time }" >我是子代组件<slot name="content" :time="time"></slot></template></test2></div>
</template>

子组件data数据vue slot 插槽隔代传数据 作用域篇 (vue2.6) 

孙级组件写法

<template><div>我是孙级组件<slot name="content" :time='time'></slot></div>
</template>

 孙级datavue slot 插槽隔代传数据 作用域篇 (vue2.6)