vue+element 返回数组或json数据自定义某列显示的处理--两种方法

简介: 本文是作者开发一个业务需求时,将返回数据列表的其中一个数据长度很长的字段处理成数组,并将其作为子表显示的过程,具体样式如下(数据做了马赛克处理)![请在此添加图片描述](https://developer-private-1258344699.cos.ap-guangzhou.myqcloud.com/column/article/5877188/20231030-902560ce.png?x-cos-security-token=v61lCvRHgTvmeijokvUBGGxbT01lDU8ac78083fc31c5e3a734833edd862768549WL7GvROHQNGkc9F

本文是作者开发一个业务需求时,将返回数据列表的其中一个数据长度很长的字段处理成数组,并将其作为子表显示的过程,具体样式如下(数据做了马赛克处理)

请在此添加图片描述

返回的过长字段数据处理(用分号分隔的一个长字段):

this.list = this.currentRow.failMessage.split(';')

法一:

利用插槽获取值

请在此添加图片描述

法二:利用js数组map方法 “自己封装prop”

// 数据处理
this.list.map((item: string) => {
   
   
    this.gvUploadFailList.push({
   
   errorName:item})
})

请在此添加图片描述

大功告成!

以上就是vue+element 返回数组或json数据自定义某列显示的处理--两种方法的介绍,做此记录,如有帮助,欢迎点赞关注收藏!

目录
相关文章
|
19天前
|
JSON JavaScript 前端开发
JavaScript原生代码处理JSON的一些高频次方法合集
JavaScript原生代码处理JSON的一些高频次方法合集
|
20天前
Vue3 子传父 暴露数据 defineExpose
Vue3 子传父 暴露数据 defineExpose
Vue3 子传父 暴露数据 defineExpose
|
1天前
|
监控 JavaScript
Vue中的数据变化监控与响应——深入理解Watchers
Vue中的数据变化监控与响应——深入理解Watchers
|
2天前
|
JSON 数据可视化 定位技术
python_将包含汉字的字典数据写入json(将datav的全省数据中的贵州区域数据取出来)
python_将包含汉字的字典数据写入json(将datav的全省数据中的贵州区域数据取出来)
7 0
|
15天前
|
存储 JSON JavaScript
「Python系列」Python JSON数据解析
在Python中解析JSON数据通常使用`json`模块。`json`模块提供了将JSON格式的数据转换为Python对象(如列表、字典等)以及将Python对象转换为JSON格式的数据的方法。
31 0
|
16天前
|
JavaScript
【vue】 element upload文件上传后表单校验信息还存在
【vue】 element upload文件上传后表单校验信息还存在
16 1
|
16天前
|
存储 JavaScript 搜索推荐
vue如何实现登录数据的持久化
vue如何实现登录数据的持久化
|
16天前
|
JavaScript 前端开发
vue绑定数组
vue绑定数组
|
19天前
|
存储 JSON 数据挖掘
python逐行读取txt文本中的json数据,并进行处理
Python代码示例演示了如何读取txt文件中的JSON数据并处理。首先,逐行打开文件,然后使用`json.loads()`解析每一行。接着,处理JSON数据,如打印特定字段`name`。异常处理包括捕获`JSONDecodeError`和`KeyError`,确保数据有效性和字段完整性。将`data.txt`替换为实际文件路径运行示例。
14 2
|
19天前
|
JavaScript
vue element 导出blob后台文件流xlsx文件自动下载(且规避乱码)
vue element 导出blob后台文件流xlsx文件自动下载(且规避乱码)