正常情况下,iview框架table表格内容只需配置好 key 就OK,

稍微复杂点就是用一个reder函数进行操作(params.row 为本行数据)

以上问题都很好解决,无需太动脑筋。

开发中遇到需求就是表格某一格内容不能直接获取,必须从数组中遍历出所有name,并且每个name配以唯一id,点击name时通过id跳转传参

后台返回数据如下

1、首先要把把name和id 进行拆分配对

function customStyleList(row){
var nameList=row.styleName.split(",")
var nameIDList=row.id.split(",")
var styleList=[]
for(let i=;i<nameList.length;i++){
arr={name:nameList[i],id:nameIDList[i]}
styleList.push(arr)
}
return styleList //此时组件一个有值数组
}
2、render 函数里循环 styleList 数组

OK完美解决

效果如下

参考iview官方IPA  https://www.iviewui.com/components/table

iview table表格内容为数组或者对象的子元素时问题讨论的更多相关文章

  1. 使用 iview Table 表格组件修改操作的显示隐藏

    使用 iview Table 表格组件修改操作的显示隐藏,如下图 1.如何设置 table 操作按后台传入的状态值去渲染 不同的按钮? 解决方法 我们在vue2中,动态渲染html 使用的是 retu ...

  2. ret.data[0]._highlight = true iview table表格高亮

    ret.data[0]._highlight = true iview table表格高亮

  3. js和jquery获取当前对象的子元素

    开发中经常遇到需要获取ul下的il对象,个人总结了js和jquery的方法. HTML片断: <ul class="box"> <li>子元素1</l ...

  4. table表格内容溢出处理

    直接在table标签加上  style="table-layout:fixed;word-wrap:break-word;"

  5. LayUI table表格控件 如何显示 对象中的属性(针对Mybatis的级联查询--一对一情况)

    1.entity如下: 2.Mybatis的Mapper.xml文件如下 <resultMap id="BaseResultMapPlus" type="dicIt ...

  6. iview Table表格单选框互斥

    表格中添加单选框,并且互斥 首先带data中定义   currentid : 0 :表示默认不选中 { title: "名称", key: "name", re ...

  7. 用echartsjs 实现散点图与table表格双向交互,以及实现echarts取自于table数据,和自定义echarts提示内容

    本人研究echarts已经有一段时间了,今天就分享几个关于echarts的小技巧.虽然看起来简单,但做起来却很繁琐,不过实用性倒是很好. 在一个大的页面中,左边为table表格,右边为echarts的 ...

  8. html table表格导出excel的方法 html5 table导出Excel HTML用JS导出Excel的五种方法 html中table导出Excel 前端开发 将table内容导出到excel HTML table导出到Excel中的解决办法 js实现table导出Excel,保留table样式

    先上代码   <script type="text/javascript" language="javascript">   var idTmr; ...

  9. vue+iview中的table表格导出excel表格

    一.iveiw框架中table中有exportCsv()方法可以导出.csv后缀文件,类似于excel文件,但是并不是excel文件. 二.实现table表格导出excel文件利用Blob.js 和 ...

随机推荐

  1. redis持久化优缺点

  2. JS使用正则表达式获取小括号、中括号及花括号内容的方法示例

    本文实例讲述了JS使用正则表达式获取小括号.中括号及花括号内容的方法.分享给大家供大家参考,具体如下: JS 正则表达式 获取小括号 中括号 花括号内的内容 <!DOCTYPE html> ...

  3. Spring Boot 2.x基础教程:找回启动日志中的请求路径列表

    如果您看过之前的Spring Boot 1.x教程,或者自己原本就对Spring Boot有一些经验,或者对Spring MVC很熟悉.那么对于Spring构建的Web应用在启动的时候,都会输出当前应 ...

  4. shell脚本编程学习笔记(四)shell操作数据库

    一.数据库基本操作 1)登录mysql服务器:mysql -u root -p 密码 2)查看数据库:show databases 3)查看表:show tales from db; 4)查看表结构: ...

  5. 吴裕雄 python 机器学习——集成学习随机森林RandomForestRegressor回归模型

    import numpy as np import matplotlib.pyplot as plt from sklearn import datasets,ensemble from sklear ...

  6. 【音乐欣赏】《Forget》 - The Tech Thieves

    曲名:Forget 作者:The Tech Thieves [00:00.000] 作曲 : Mark Emmanuel/Alia May Plesa-Topham [00:01.000] 作词 : ...

  7. bit Buffer

    在音频流解析过程中,常常会涉及到顺序读取某些bit的操作. #include<stdio.h> typedef struct _BIT_BUF { unsigned char buffer ...

  8. 基于jmeter+ant实现的接口自动化测试

    jmeter+ANT接口自动化测试框架 项目说明 本框架是一套基于jmeter+Ant+Excel+Python而设计的数据驱动接口自动化测试框架,jmeter 作为执行器,Ant 作为构建工具,进行 ...

  9. python实现获取电脑IP、主机名、Mac地址

    import socket import uuid # 获取主机名 hostname = socket.gethostname() #获取IP ip = socket.gethostbyname(ho ...

  10. VMware克隆centos后需要进行修改配置的地方

    1. 首先在VMware中通过复制现在状态的虚拟机或者快照形式的虚拟机,选择完整复制文件进行克隆. 2.打开克隆的虚拟机之后,需要修改主机名和相应的hosts表 2.1 修改主机名 输入  vi /e ...