什么是作用域插槽?

这里看看能稍微有点绕，一般情况下我们理解的插槽都是父组件给子组件提供数据，但是父组件如何利用子组件的数据进行填充呢？？
这就要作用域插槽

一、作用域插槽的概念
作用域插槽是带数据的插槽，子组件提供给父组件的参数，父组件根据子组件传过来的插槽数据来进行不同的展现和填充内容。在标签中通过slot-scope来接受数据。
子组件代码：

//重点记住作用域插槽就是带数据的插槽，带数据的插槽，带数据的插槽。
//携带数据的，就是子组件中的<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>

效果：