什么是作用域插槽?

大家好，欢迎来到IT知识分享网。

//重点记住作用域插槽就是带数据的插槽，带数据的插槽，带数据的插槽。 //携带数据的，就是子组件中的<slot> //子组件中携带数据，父组件中接受数据 <div> <slot name='header' :myUser='user'></slot> </div> export default { 
    data() { 
    return { 
    user: { 
    name: "周冬雨", age: 20, }, }; }, }; </script> 

父组件：

//在父组件中通过slot-scope来接受子组件提供参数 <template> <div class="father"> //`````此处重点 <child> <template v-slot:header='slot'> <!--也可以使用解构 --> <!-- <template v-slot:header='{myUser}'> --> <div>{ 
   { 
   myUser.name}}</div> <div>{ 
   { 
   myUser.age}}</div> </template> </child> //`````此处重点 </div> </template> <script> import Child from "/src/components/Child"; export default { 
    data() { 
    return { 
   }; }, components: { 
    Child, }, }; </script>