需求背景：

• 下图所示弹窗是调用一个组件来展示的，我往这个组件的插槽里添加了文本内容和一个按钮。
• 我现在的目的是想通过点击这个按钮来关闭弹窗。但实际上，弹窗的关闭动作是组件内部定义的
• 现在要解决的主要问题就是，如何能够在外部调用组件插槽的时候，拿到到组件内部的函数或者数据呢

具体操作

• 假设对应弹窗组件如下：

  这里在插槽位置绑定组件内部的函数

// pophover.vue
<div>
  <slot name='content' :close='close' :words='"一些简单的文本内容"'>  </slot>
</div>

<script lang='ts' setup>

function close(){
  console.log('运行close函数')
}

</script>

那当你调用这个组件时，获得组件内部写法的方式如下：

<pophover> 
  <template #content='{close,words}'> // 通过解构语法拿到插槽上所绑定的数据
    {{words}
    <button @click='close'> 关闭 </button>
  
  </template>

</pophover>