iview table表格内容为数组或者对象的子元素时问题讨论
正常情况下,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表格内容为数组或者对象的子元素时问题讨论的更多相关文章
- 使用 iview Table 表格组件修改操作的显示隐藏
使用 iview Table 表格组件修改操作的显示隐藏,如下图 1.如何设置 table 操作按后台传入的状态值去渲染 不同的按钮? 解决方法 我们在vue2中,动态渲染html 使用的是 retu ...
- ret.data[0]._highlight = true iview table表格高亮
ret.data[0]._highlight = true iview table表格高亮
- js和jquery获取当前对象的子元素
开发中经常遇到需要获取ul下的il对象,个人总结了js和jquery的方法. HTML片断: <ul class="box"> <li>子元素1</l ...
- table表格内容溢出处理
直接在table标签加上 style="table-layout:fixed;word-wrap:break-word;"
- LayUI table表格控件 如何显示 对象中的属性(针对Mybatis的级联查询--一对一情况)
1.entity如下: 2.Mybatis的Mapper.xml文件如下 <resultMap id="BaseResultMapPlus" type="dicIt ...
- iview Table表格单选框互斥
表格中添加单选框,并且互斥 首先带data中定义 currentid : 0 :表示默认不选中 { title: "名称", key: "name", re ...
- 用echartsjs 实现散点图与table表格双向交互,以及实现echarts取自于table数据,和自定义echarts提示内容
本人研究echarts已经有一段时间了,今天就分享几个关于echarts的小技巧.虽然看起来简单,但做起来却很繁琐,不过实用性倒是很好. 在一个大的页面中,左边为table表格,右边为echarts的 ...
- 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; ...
- vue+iview中的table表格导出excel表格
一.iveiw框架中table中有exportCsv()方法可以导出.csv后缀文件,类似于excel文件,但是并不是excel文件. 二.实现table表格导出excel文件利用Blob.js 和 ...
随机推荐
- Java“被迫”退出争霸,Python继续霸占首位!老牌程序员:我不服
2019年转眼已经接近尾声,如果盘点下2019年最火的语言,除了Python还能有谁?你心中的王者语言又是谁? 这一年Python风光无限 这一年JAVA走向右边 这一年,我们都很感慨,你呢? 关于P ...
- 8.10-Day2T2 吃喝大法好
题目大意 略... 题解 开始两个人一定是一个向右走一个向下走,向右走的人最终会走到(n-1,m),向下走的人一定会走到(n,m-1). 那么不考虑重复的话总的路径数就是从(1,2)到(n-1,m)的 ...
- SqlDataAdapter对象
https://blog.csdn.net/qq_39657909/article/details/80615465 一.特点介绍 1.表示用于填充 DataSet 和更新 SQL Server 数据 ...
- 优化 : Oracle数据库Where条件执行顺序 及Where子句的条件顺序对性能的影响
.Oracle数据库Where条件执行顺序: 由于SQL优化起来比较复杂,并且还会受环境限制,在开发过程中,写SQL必须必须要遵循以下几点的原则: 1.ORACLE采用自下而上的顺序解析WHERE子句 ...
- [Excel] 一些实用的函数式子
这次是用php写了一个系统 收集信息,需要身份证号作为验证,但是为了信息安全 只能在数据库里面放身份证后六位.也就是说.最终导出的Excel也是只有身份证的后六位.,, 后来我发现我本地保存的完整身份 ...
- laravel Excel导入导出
1.简介 Laravel Excel 在 Laravel 5 中集成 PHPOffice 套件中的 PHPExcel,从而方便我们以优雅的.富有表现力的代码实现Excel/CSV文件的导入和导出. 该 ...
- 报bug mui分享微信 ,qq 分享失败
1. iOS分享链接到微信,分享成功,但是分享的只有title,其他参数都没有 原因是mui分享进行了更新,msg新增了 msg.type 这个配置参数 qq : msg.type='text' 微信 ...
- word写文档体会
1.找一个文档规范要求. 2.根据文档的规范要求调整正文的格式,标题1的格式,标题2的格式,标题3的格式,图表的格式,把没用的那些格式都删除掉. 3.图注表注后空格一行. 4.设置页眉页脚. 5.生成 ...
- C:函数 注意点
形参 在定义函数时指定的形参,在未出现函数调用时,它们并不占内存中的存储单元,因此称它们是形式参数或虚拟参数,简称形参,表示它们并不是实际存在的数据,所以,形参里的变量不能赋值. C不像C++里一样可 ...
- MQTT 入门介绍
一.简述 MQTT(Message Queuing Telemetry Transport,消息队列遥测传输协议),是一种基于发布/订阅(publish/subscribe)模式的"轻量级& ...