首页 > 其他分享 >vue+elemtUI获取单行的id

vue+elemtUI获取单行的id

时间:2024-04-19 09:57:19浏览次数:23  
标签:vue elemtUI brand method 获取 scope id row

问题情境:

 当对某一行数据做删除或修改操作时,我们往往需要获取该行数据的实体,例如我的表单数据为数据库中brand表的展示,所以我需要得到的是通过点击修改或删除能得到brand.id,从而在method中使用id获取后端的具体brand对象

解决方法

<body>内这样书写:

先在table-column中加入v-slot="scope",再在onclick的方法中加入参数scope.row.id。其中scope.row即代表该行的brand,scope.row.id即代表g该brand的id。

method中这样书写:

 参数对照上面的直接写id,如果上面的参是scope.row,这里的参必须写row。另外,获取该数据时千万不要在前面加this,或在axios中加_tihs,写成this.id就获取不到数据了

标签:vue,elemtUI,brand,method,获取,scope,id,row
From: https://www.cnblogs.com/lianthankyou/p/18145118

相关文章

  • Springboot vue pdf/图片 加水印下载
    1:引入包<dependency><groupId>org.apache.pdfbox</groupId><artifactId>pdfbox</artifactId><version>2.0.27</version></dependency>2前端代码:downloadFile1(fileUrl,filename){if(filename==null||fi......
  • vue引入字体icon
    这里我用的是阿里图标库1.2.3.4.在vue的assets文件中增加一个font文件把解压后的文件复制进去,并在mian.js中引入iconfont.css5.1.使用,复制以下代码在页面中使用<h1>欢迎<iclass="iconfont">&#xe67c;</i></h1>5.1.2使用,复制一下代码在页面中使用<h1>欢迎<icla......
  • Aura QuickAction Override
    <aura:componentaccess="global"implements="force:hasRecordId,lightning:actionOverride,lightning:hasPageReference"><aura:htmltag="style">.slds-modal.slds-fade-in-open.cAccountNewCmp.slds-modal_......
  • NVIDIA驱动失效简单解决方案:NVIDIA-SMI has failed because it couldn‘t communicate
    NVIDIA驱动失效简单解决方案:NVIDIA-SMIhasfailedbecauseitcouldn‘tcommunicatewiththeNVIDIAdriver.问题:准备用GPU跑模型时,提示cuda不存在第一步,打开终端,输入:vidia-smi1|NVIDIA-SMIhasfailedbecauseitcouldn'tcommunicatewiththeNVIDIAdriver.2|Make......
  • Vue的class类面向对象
    一.准备工作JavaScript语言中,生成实例对象的传统方法是通过构造函数functionAnimal(name,age){this.name=name;this.age=age;}Animal.prototype.showName=function(){console.log(this.name);......
  • 6个高级Vue3知识技巧
    Vue3是一个非常流行的前端框架,广泛应用于大型互联网企业和个人项目。虽然我们已经熟悉了一些常见的Vue3知识,但还有一些不太常见但实用性很强的点可以帮助我们进一步优化和提升Vue3应用的性能和开发效率。本文将介绍一些不太常见的Vue3知识点。01、TeleportTeleport是V......
  • VuePress搭建文档网站
    VuePress官方文档:https://v2.vuepress.vuejs.org/zh/guide/getting-started.html以下是官方文档复制过来的步骤,加上了我的一些经验注释。1、依赖环境Node.jsv18.16.0+(我试了v14是运行不了的,必须这个版本及以上,建议安装nvm,方便切换node版本)包管理器,如pnpm、yarn、npm等(我安......
  • vue3 获取遍历的子组件
    <template><div><!--使用v-for遍历数据,并为每个子组件设置一个ref--><ChildComponentv-for="(item,index)initems":key="index":ref="el=>setChildRef(el,index)"/></div>......
  • 【转】[C#][WPF] GridControl 列宽控制
    在设置DevExpress里的GridControl自动列宽时,有两个方式:view.BestFitColumn(gridColumn);view.BestFitColumns();但我想要达到这样的效果:1、加载配置,读取列宽2、未配置列宽的列自动列宽发现可以这样组合://如果已配置列宽,自动列宽就是配置的宽度if(gridColumn.Widt......
  • BOSHIDA DC电源模块的发展趋势和前景展望
    BOSHIDADC电源模块的发展趋势和前景展望随着电子产品的普及和多样化,对电源模块的需求也越来越大。其中,DC电源模块作为一种重要的电源供应方式,在各个领域有着广泛的应用。在过去的几十年里,DC电源模块已经经历了多次技术革新和发展,未来的发展趋势也值得关注。本文将从多个方面对DC......