vue2.0中实现从对像到数组的转换⼀、对像
从后台直接返回的数据,赋值给vue的变量,显⽰出来如下,它是对像
[ { "被评分⼈": "150********", "问卷ID": "BD20200915170817", "总分": 333, "均分": 83, "计数": 4, "name": "XX1" },
{ "被评分⼈": "139********", "问卷ID": "BD20200915170817", "总分": 301, "均分": 75, "计数": 4, "name": "XX2" } ]
在模版中可以通过v-for来⽅便的读取和使⽤。
⼆、数组
但是在js中进⾏计算时,⽤到的基本上都是数组,特别是需要绑定数据到ECharts图表上时,下⾯的就是数组。[ [ "150********", "BD20200915170817", 333, 83, 4, "XX1" ],
[ "139********", "BD20200915170817", 301, 75, 4, "XX2" ] ]
那么对像怎么转换成数组了,刚开始⽤for来读取⼀下吧,结果卡壳了,百度了⼀下ES6有新的⽅法来实现。
vue逗号分割的字符串转数组
三、对像到数组的转换
1、Object.values(obj)⽤来获取值
2、Object.keys(obj)⽤来获取键名
返回对像中的数据
1    computed:{
2        dataText:function(){
3var mainData=[];
4for (var i=0;i<this.fenxiData.length;i++){
5var item=this.fenxiData[i];
6                mainData.push(Object.values(item));
7            }
8return mainData;
9        },
10    },
返回的结果如下
[ [ "150********", "BD20200915170817", 333, 83, 4, "XX1" ],
[ "139********", "BD20200915170817", 301, 75, 4, "XX2" ] ]
返回对像中的键名
1 dataTitle:function(){
2var item=[];
3if(this.fenxiData.length>0){
4            item=this.fenxiData[0];
5      }
6return Object.keys(item);
7 },
返回的结果如下
[ "被评分⼈", "问卷ID", "总分", "均分", "计数", "name" ]
数据加⼯好以后,就可以⽤来绑定到Echarts中了。

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。