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>
              </>
          )
        }
      }
相关推荐
少年姜太公14 小时前
什么?还不知道git cherry pick?
前端·javascript·git
Liu.77416 小时前
vue3使用vue3-print-nb打印
前端·javascript·vue.js
dly_blog17 小时前
Vue 逻辑复用的多种方案对比!
前端·javascript·vue.js
wyzqhhhh18 小时前
京东啊啊啊啊啊
开发语言·前端·javascript
想学后端的前端工程师18 小时前
【Java集合框架深度解析:从入门到精通-后端技术栈】
前端·javascript·vue.js
GISer_Jing19 小时前
Nano Banana:AI图像生成与编辑新标杆
前端·javascript·人工智能
csdn_aspnet19 小时前
用100行實現HTML5可存檔塗鴉版
javascript
布茹 ei ai19 小时前
城市天气查询系统 (City Weather Dashboard)
javascript·vue.js·html·css3·开源软件·天气预报
梵尔纳多20 小时前
Electron 主进程和渲染进程通信
javascript·arcgis·electron
巴拉巴拉~~21 小时前
Flutter 通用滑块组件 CommonSliderWidget:单值 / 范围 + 刻度 + 标签 + 样式自定义
开发语言·前端·javascript