

这边后端返回的数据格式是一个数组里面每个字段后面是一个对象。现在前端需要是把这个变为外面用一个数组包着这些对象。
handleRefresh() {
apigetUpdateObjectLog({ objectId: this.objectId }).then((res) => {
if (res.data) {
console.log('接口数据',JSON.parse(JSON.stringify(res.data)));
let dataArray = res.data.map((ma, index) => {
// console.log(Object.keys(ma))
let obj = {};
let objArray = [];
let inx = 0;
Object.keys(ma).forEach((key) => {
if (key === "updateTime" || key === "updateName") {
obj[key] = ma[key];
} else {
// 生成一个数组,用来接受对象
objArray[inx] = ma[key];
inx++;
}
});
obj["objArray"] = objArray;
return obj;
});
this.objectArray = dataArray;
console.log('组装后数据',JSON.parse(JSON.stringify(dataArray)));
} else {
this.objectArray = [];
}
});
},
},
<template>
<div class="block">
<el-timeline v-for="(item,index) in objectArray" :key="index" class="timeLine">
<el-timeline-item placement="top" :timestamp="item.updateTime | formDateFilter">
{{item.updateName}}
<el-card style="margin-top:10px">
<div class="modifyContainer">
<div v-for="(itemJ,j) in item.objArray" class="one-item" :key="j">
<div>
{{j+1}}.将
</div>
<div class="title">
<div class="topItem">{{itemJ.chineseName}}</div>
</div>
<div>
{{'由'}}
</div>
<div class="item">
<div class="topItem" v-if="itemJ.type=='text'">{{itemJ.oldValue}}</div>
<div class="topItem" v-if="itemJ.type=='time'">{{itemJ.oldValue | formDateFilter}}</div>
<div class="topItem" style="display:flex" v-if="itemJ.type=='img'">
<div v-for="(item2,index2) in itemJ.oldValue.split(',')" :key="index2">
<!-- <img style="width:100px;height:100px" :src="openFileApi + item2" alt=""> -->
<el-image style="width: 100px; height: 80px;margin-right:5px" :src="openFileApi + item2" :preview-src-list="itemJ.oldValue.split(',').map(item3=>{return openFileApi+item3})"></el-image>
</div>
</div>
</div>
<div>
{{'修改为'}}
</div>
<div class="item">
<div class="topItem" v-if="itemJ.type=='text'">{{itemJ.newValue}}</div>
<div class="topItem" v-if="itemJ.type=='time'">{{itemJ.newValue | formDateFilter}}</div>
<div class="topItem" style="display:flex" v-if="itemJ.type=='img'">
<div v-for="(item2,index2) in itemJ.newValue.split(',')" :key="index2">
<!-- <img style="width:100px;height:100px" :src="openFileApi + item2" alt=""> -->
<el-image style="width: 100px; height: 80px;margin-right:5px" :src="openFileApi + item2" :preview-src-list="itemJ.newValue.split(',').map(item3=>{return openFileApi+item3})"></el-image>
</div>
</div>
</div>
</div>
</div>
</el-card>
</el-timeline-item>
</el-timeline>
</div>
</template>
网友评论