jsx中使用插槽

1. jsx语法中使用插槽

以elementplus ElPopconfirm 为例

javascript 复制代码
<el-popconfirm title="Are you sure to delete this?">
    <template #reference>
      <el-button>Delete</el-button>
    </template>
  </el-popconfirm>

使用

javascript 复制代码
      slots: {
        default: (data: any) => {
          const slot = {
            reference: () => (
                <div>{1111}</div>
            )
          }
          return (
              <>
                <ElPopconfirm title="Are you sure to delete this?" v-slots={slot}></ElPopconfirm>
              </>
          )
        }
      }
相关推荐
Highcharts.js13 小时前
什么是散点图?一文学会Highcharts散点图的核心特性与3D扩展应用
javascript·3d·开发文档·散点图·highcharts·图表类型
phltxy14 小时前
Vue Router:从入门到实战
前端·javascript·vue.js
Zhencode14 小时前
Vue3核心运行时之runtime-core
前端·javascript·vue.js
随逸17715 小时前
《吃透防抖与节流:从原理到实战,彻底解决高频事件性能问题》
javascript
千寻girling15 小时前
面试官 : “ 请说一下 JS 的常见的数组 和 字符串方法有哪些 ? ”
前端·javascript·面试
不会敲代码115 小时前
面试必考:如何优雅地将列表转换为树形结构?
javascript·算法·面试
用户57573033462415 小时前
深入理解 Promise:从单线程到异步流程控制的终极指南
javascript
我是伪码农15 小时前
Vue 大事件管理系统
前端·javascript·vue.js
无巧不成书021815 小时前
KMP适配鸿蒙开发实战|从0到1搭建可运行工程
javascript·华为·harmonyos·kmp
henry10101015 小时前
DeepSeek生成的网页版小游戏 - 冰壶
前端·javascript·css·html5