vue3中element Plus插槽

                <el-table-column property="" label="操作" width="200" show-overflow-tooltip><template #default="scope"><span @click="handleSimilarQuestion(scope.row)">相似问</span><span @click="handleEdit(scope.row)">编辑</span><!-- <span @click="printRow(scope.row)">删除</span> --><!-- 插槽 title记得加: --><el-popconfirm :title="`确认删除:  ${questionNum}  ?`" width="200" @confirm="confirmEvent"@cancel="cancelEvent" confirm-button-text="确认" cancel-button-text="取消"><template #reference><span @click="printRow(scope.row)">删除</span></template></el-popconfirm></template></el-table-column>

js


// 问答库  删除函数
let questionNum = ref('')function printRow(row: any) {// console.log(row.question); // 打印当前行的数据  questionNum.value = row.question// console.log(questionNum.value)
}
const confirmEvent = () => {console.log('确认删除')
}
const cancelEvent = () => {console.log('取消删除')
}// 相似问
function handleSimilarQuestion(row:any) {  console.log(row);  }  // 编辑
function handleEdit(row:any) {  console.log(row); }  
  • #default="scope" 定义了一个名为 default 的插槽,并将当前行的数据传递给一个名为 scope 的变量。

<template #default="scope">

  • @click="printRow(scope.row)" 是一个事件监听器,它会在该 <span> 元素被点击时调用 printRow 函数,并将 scope.row(即当前行的数据)作为参数传递。

<span @click="printRow(scope.row)">删除</span>

  • 当该函数被调用时,会使用 console.log 将参数 row 的内容打印到浏览器的控制台。

function printRow(row: any) {

console.log(row.question); // 打印当前行的数据  

}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/bicheng/10341.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

vivado Spartan-7 配置存储器器件

下表所示闪存器件支持通过 Vivado 软件对 Spartan -7 器件执行擦除、空白检查、编程和验证等配置操作。 本附录中的表格所列赛灵思系列非易失性存储器将不断保持更新 &#xff0c; 并支持通过 Vivado 软件对其中所列非易失性存储器 进行擦除、空白检查、编程和验证。赛灵…

礼赞劳动节,致敬劳动者。节日随想:疾笔耕耘也是一种劳动方式。

马克思也快诞辰了206年了&#xff0c;恩格斯领导的第二国际通过的决议节日也迎来了134岁的生日了&#xff0c;我也继续在劳动的路上。 五月是值得纪念的日子&#xff0c;作为一名无上光荣的分子&#xff0c;无比仰慕崇拜的两位先驱前辈大胡子&#xff0c;其一 生于斯&#xff0…

VTK官方示例

VTK官方示例 -vtk字體 #!/usr/bin/env python# noinspection PyUnresolvedReferences import vtkmodules.vtkInteractionStyle # noinspection PyUnresolvedReferences import vtkmodules.vtkRenderingFreeType # noinspection PyUnresolvedReferences import vtkmodules.vtk…

标准参编征集|《第三方运维服务水平评价指南 工业废水处理设施》

目前&#xff0c;对于工业废水处理设施第三方运维服务的标准&#xff0c;国家和行业未曾出台有针对性的评价标准和规范&#xff0c;工业企业和工业园区对第三方运维服务的监督、考核、评价体系需要进一步补充和完善。 本标准的编制旨在帮助第三方运营单位从运营技术和管理举措…

PDF文件恢复:四种实用方法全解析

如何恢复已删除的PDF文件&#xff1f; PDF是Portable Document Format&#xff08;便携式文档格式&#xff09;的缩写&#xff0c;是一种由Adobe Systems开发的文件格式。PDF文件可以包含文本、图形、链接、多媒体以及其他各种元素&#xff0c;并且能够在各种操作系统和设备上…

[数据集][目标检测]纸箱子检测数据集VOC+YOLO格式8375张1类别

数据集格式&#xff1a;Pascal VOC格式YOLO格式(不包含分割路径的txt文件&#xff0c;仅仅包含jpg图片以及对应的VOC格式xml文件和yolo格式txt文件) 图片数量(jpg文件个数)&#xff1a;8375 标注数量(xml文件个数)&#xff1a;8375 标注数量(txt文件个数)&#xff1a;8375 标注…

车辆充电桩|基于Springboot+vue的车辆充电桩管理系统的设计与实现(源码+数据库+文档)

车辆充电桩管理系统 目录 基于Springboot&#xff0b;vue的车辆充电桩管理系统设计与实现 一、前言 二、系统设计 三、系统功能设计 1 前台功能模块 4.1.1 首页功能 4.1.2 用户后台管理 2 后台功能模块 4.2.1 管理员功能 4.2.2 维修员功能 四、数据库设计 五、核…

解决“电脑开机黑屏Explorer进程卡死“问题

今天&#xff0c;给台式机按电源键&#xff0c;进入windows系统时&#xff0c;发现电脑黑屏了&#xff0c;昨天还好好的&#xff0c;怎么今天电脑桌面进不去了&#xff1f;想起Windows XP、Windows 7、Windows 10 、Windows 11等系统&#xff0c;在使用多个文件拷贝时&#xff…

AI写作推荐-写文ai-AI在线写作生成器-3步完成写作任务

AI写作利器&#xff1a;推荐几款神助攻文案创作工具 随着技术的进步&#xff0c;人工智能&#xff08;AI&#xff09;已达到高级水平&#xff0c;在众多领域展现其强大能力。 在文本创作的领域&#xff0c;人工智能&#xff08;AI&#xff09;应用已显著地提升了写作效率和创意…

Python混淆矩阵用例

&#x1f4dc;用例 &#x1f4dc;Python社群纽带关系谱和图神经 | &#x1f4dc;多标签混淆矩阵模型 | &#x1f4dc;二元分类分层混淆矩阵模型 | &#x1f4dc;混淆矩阵评估特征归因 ✒️梗概 混淆矩阵是评估分类模型性能的有用工具。 该矩阵通过将预测值与实际值进行比较&…

【MySQL】6.强化数据防线:MySQL安全机制的配置与应用

数据库作为企业数据的核心存储地&#xff0c;其安全性直接关系到企业的命脉。MySQL&#xff0c;作为广泛使用的开源数据库管理系统&#xff0c;提供了一套全面安全机制来保护数据免受未授权访问和各种潜在威胁。本文将深入探讨MySQL安全机制的组成要素、实际应用以及它们在保障…

2024数维杯数学建模B题生物质和煤共热解问题的研究原创论文分享

大家好&#xff0c;从昨天肝到现在&#xff0c;终于完成了2024数维杯数学建模挑战赛B题的完整论文啦。 实在精力有限&#xff0c;具体的讲解大家可以去讲解视频&#xff1a; 2024数维杯数学建模B题煤共热解每一问高质量完整代码讲解&#xff01;_哔哩哔哩_bilibili 2024数维杯…

实用的 Google Chrome 命令

以下是一些实用的 Google Chrome 命令&#xff1a; chrome://version - 显示 Chrome 浏览器的详细信息&#xff0c;包括版本号、用户代理和命令行参数等。 chrome://flags - 打开 Chrome 实验性功能页面&#xff0c;可以启用或禁用各种实验性功能。请注意&#xff0c;这些功能…

学习Java的日子 Day44 初识前端

Day44 HTML 学习路线&#xff1a; 前端&#xff1a;展示页面、与用户交互 — HTML 后端&#xff1a;数据的交互和传递 — JavaEE/JavaWeb 1.B/S和C/S B/S&#xff1a;浏览器/服务器 教务系统 C/S&#xff1a;客户端/服务器 优缺点 1.开发/维护成本&#xff1a;B/S相对低 2.运算…

IPv6资产测绘哪家强?揭秘新一代网络空间资产测绘平台的独门秘籍

网络空间资产测绘&#xff0c;即通过一系列技术手段&#xff0c;对网络中的各类资产进行全面的发现、分类和定位&#xff0c;为各类用户提供精准的数据支撑和决策依据。网络空间资产测绘作为一门新兴的交叉学科&#xff0c;融合了计算机网络技术、数据挖掘、人工智能、信息安全…

解构复合人工智能系统(Compound AI Systems):关键术语、理论、思路、实践经验

编者按&#xff1a; 大模型的出现为构建更智能、更复杂的人工智能系统带来了新的契机。然而&#xff0c;单一的大模型难以应对现实世界中错综复杂的问题&#xff0c;需要与其他模块相结合&#xff0c;构建出复合人工智能系统&#xff08;Compound AI Systems&#xff09;。 本文…

Python经典案例爬取豆瓣Top250电影数据

随着网络数据的日益丰富&#xff0c;如何从海量的信息中快速、准确地提取出有价值的数据&#xff0c;成为了许多开发者和技术爱好者关注的焦点。在这个过程中&#xff0c;网络爬虫技术凭借其强大的数据获取能力&#xff0c;成为了数据分析和挖掘的重要工具。本文将通过一个经典…

学习笔记:IEEE 1003.13-2003【POSIX PSE53接口列表】

一、POSIX PSE53接口列表 根据IEEE 1003.13-2003&#xff0c;整理了POSIX PSE53接口API&#xff08;一共126个&#xff09;&#xff0c;每个API支持链接查看。 IEEE POSIX接口online搜索链接&#xff1a; The Open Group Base Specifications Issue 7, 2018 edition 详细内…

修改表空间对应数据文件的大小

Oracle从入门到总裁:​​​​​​https://blog.csdn.net/weixin_67859959/article/details/135209645 表空间与数据文件紧密相连&#xff0c;相互依存&#xff0c;创建表空间的时候需设置数据文件大小。 在后期实际应用中&#xff0c;如果实际存储的数据量超出事先设置的数据…

1.5编程基础之循环控制 04:求整数的和与均值

总时间限制: 1000ms 内存限制: 65536kB 描述 读入n&#xff08;1 < n < 10000&#xff09;个整数&#xff0c;求它们的和与均值。 输入 输入第一行是一个整数n&#xff0c;表示有n个整数。 第2~n1行每行包含1个整数。每个整数的绝对值均不超过10000。 输出 输出…