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>
              </>
          )
        }
      }
相关推荐
Jing_Rainbow24 分钟前
【React-10/Lesson94(2026-01-04)】React 性能优化专题:useMemo & useCallback 深度解析🚀
前端·javascript·react.js
白中白1213830 分钟前
Vue系列-3
前端·javascript·vue.js
无巧不成书02181 小时前
React Native 深度解析:跨平台移动开发框架
javascript·react native·react.js·华为·开源·harmonyos
奋斗吧程序媛1 小时前
vue3初体验(1)
前端·javascript·vue.js
资深web全栈开发1 小时前
设计模式之桥接模式 (Bridge Pattern)
javascript·设计模式·桥接模式
UIUV2 小时前
语义化搜索学习笔记(结合代码实战)
javascript·后端·node.js
2301_796512522 小时前
【精通篇】打造React Native鸿蒙跨平台开发高级复合组件库开发系列:订单步骤条实践
javascript·react native·react.js·ecmascript·harmonyos
程序员酥皮蛋2 小时前
react 01 初学react
前端·javascript·react.js
程序员林北北2 小时前
【前端进阶之旅】3 道前端超难面试题深度解析(2026 版)|附完整代码 + 实战场景
前端·javascript·css3·html5
东东5162 小时前
ssm机场网上订票系统 +VUE
java·前端·javascript·vue.js·毕设