html5 - Vue 2.0 javaScript 数组循环push json 对象问题
本文介绍了html5 - Vue 2.0 javaScript 数组循环push json 对象问题的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
问 题
我需要将一个大数组 以里面的json其中一个值去分成两个数组。 我用push 出现了引用问题, 导致数据不准。请问需要怎么解决,我用的 vue2.0
以下是数组, 用各json里面的type 分为两类。 type = 1 为 needArr ,type = 2 为serverArr 。
"NEED_ITEM": [
{
"IS_VISIT": "0",
"ITEM_ID": "1",
"ITEM_NAME": "机油",
"INTRO": "推荐5000公里修理一次\/6个月",
"PRICE": "100",
"ITEM_STATUS": "1",
"ITEM_TYPE": "1",
"ITEMS": [
{
"ITEM_ID": "23",
"ITEM_NAME": "嘉实多(极护)0W-40全合成机油 7L ",
"PRICE": "602",
"IMG_URL": "http:\/\/www.52cdd.com\/Butler\/data\/attachment\/image\/20160823\/1010aecf50b12c9827c5a00d7132eae8.jpg",
"IS_VOUCH": "1"
},
{
"ITEM_ID": "41",
"ITEM_NAME": "金美孚0W-40全合成机油 7L ",
"PRICE": "726",
"IMG_URL": "http:\/\/www.52cdd.com\/Butler\/data\/attachment\/image\/20160823\/1010aecf50b12c9827c5a00d7132eae8.jpg",
"IS_VOUCH": "1"
},
{
"ITEM_ID": "55",
"ITEM_NAME": "壳牌(灰喜力)5W-30全合成机油 7L ",
"PRICE": "614",
"IMG_URL": "http:\/\/www.52cdd.com\/Butler\/data\/attachment\/image\/20160823\/1010aecf50b12c9827c5a00d7132eae8.jpg",
"IS_VOUCH": "1"
},
{
"ITEM_ID": "982",
"ITEM_NAME": "俄罗斯原装进口5W-40合成机油 7L",
"PRICE": "508",
"IMG_URL": "http:\/\/www.52cdd.com\/Butler\/data\/attachment\/image\/20160823\/1010aecf50b12c9827c5a00d7132eae8.jpg",
"IS_VOUCH": "1"
},
{
"ITEM_ID": "1646",
"ITEM_NAME": "俄罗斯原装进口5W-30全合成机油 7L",
"PRICE": "764",
"IMG_URL": "http:\/\/www.52cdd.com\/Butler\/data\/attachment\/image\/20160823\/1010aecf50b12c9827c5a00d7132eae8.jpg",
"IS_VOUCH": "1"
},
{
"ITEM_ID": "",
"ITEM_NAME": null,
"PRICE": "764",
"IMG_URL": "http:\/\/www.52cdd.com\/Butler\/data\/attachment\/image\/20160823\/1010aecf50b12c9827c5a00d7132eae8.jpg",
"IS_VOUCH": "1"
},
{
"ITEM_ID": "",
"ITEM_NAME": null,
"PRICE": "508",
"IMG_URL": "http:\/\/www.52cdd.com\/Butler\/data\/attachment\/image\/20160823\/1010aecf50b12c9827c5a00d7132eae8.jpg",
"IS_VOUCH": "1"
}
]
},
{
"IS_VISIT": "0",
"ITEM_ID": "2",
"ITEM_NAME": "机油滤清器",
"INTRO": "推荐5000公里修理一次\/6个月",
"PRICE": "100",
"ITEM_STATUS": "1",
"ITEM_TYPE": "1",
"ITEMS": [
{
"ITEM_ID": "0",
"ITEM_NAME": "暂无此配件,请致电4008200260",
"PRICE": "0",
"IMG_URL": "",
"IS_VOUCH": "1"
}
]
},
{
"IS_VISIT": "0",
"ITEM_ID": "5",
"ITEM_NAME": "空气滤清器",
"INTRO": "推荐5000公里修理一次\/6个月",
"PRICE": "100",
"ITEM_STATUS": "1",
"ITEM_TYPE": "1",
"ITEMS": [
{
"ITEM_ID": "0",
"ITEM_NAME": "暂无此配件,请致电4008200260",
"PRICE": "0",
"IMG_URL": "",
"IS_VOUCH": "1"
}
]
},
{
"IS_VISIT": "1",
"ITEM_ID": "6",
"ITEM_NAME": "火花塞",
"INTRO": "推荐5000公里修理一次\/6个月",
"PRICE": "80",
"ITEM_STATUS": "3",
"ITEM_TYPE": "2",
"ITEMS": [
{
"ITEM_ID": "0",
"ITEM_NAME": "暂无此配件,请致电4008200260",
"PRICE": "0",
"IMG_URL": "",
"IS_VOUCH": "1"
}
]
},
{
"IS_VISIT": "1",
"ITEM_ID": "8",
"ITEM_NAME": "刹车油",
"INTRO": "推荐5000公里修理一次\/6个月",
"PRICE": "100",
"ITEM_STATUS": "3",
"ITEM_TYPE": "2",
"ITEMS": [
{
"ITEM_ID": "0",
"ITEM_NAME": "暂无此配件,请致电4008200260",
"PRICE": "0",
"IMG_URL": "",
"IS_VOUCH": "1"
}
]
},
{
"IS_VISIT": "1",
"ITEM_ID": "7",
"ITEM_NAME": "变速箱油",
"INTRO": "推荐5000公里修理一次\/6个月",
"PRICE": "100",
"ITEM_STATUS": "3",
"ITEM_TYPE": "2",
"ITEMS": [
{
"ITEM_ID": "0",
"ITEM_NAME": "暂无此配件,请致电4008200260",
"PRICE": "0",
"IMG_URL": "",
"IS_VOUCH": "1"
}
]
}
]
我的代码 ,以下代码导致两组数据不准确。
for (var i = 0; i < needItem.length; i++) {
for (var j = 0; j< needItem[i].ITEMS.length; j++) {
console.log(1);
if (needItem[i].ITEMS[j].IS_VOUCH == 1) {
needItem[i].VOUCH_ITEM = needItem[i].ITEMS[j];
break;
}
}
}
更新原数据
{
"RESPCODE": 0,
"RESPMSG": "操作成功",
"RESULT": {
"MIN_SEP": "5000",
"MAIN_MILEAGE": "100000",
"IS_CAN_STORE": "0",
"NEED_ITEM": [
{
"IS_VISIT": "0",
"ITEM_ID": "1",
"ITEM_NAME": "机油",
"INTRO": "推荐5000公里修理一次\/6个月",
"PRICE": "100",
"ITEM_STATUS": "1",
"ITEM_TYPE": "1",
"ITEMS": [
{
"ITEM_ID": "23",
"ITEM_NAME": "嘉实多(极护)0W-40全合成机油 7L ",
"PRICE": "602",
"IMG_URL": "http:\/\/www.52cdd.com\/Butler\/data\/attachment\/image\/20160823\/1010aecf50b12c9827c5a00d7132eae8.jpg",
"IS_VOUCH": "1"
},
{
"ITEM_ID": "41",
"ITEM_NAME": "金美孚0W-40全合成机油 7L ",
"PRICE": "726",
"IMG_URL": "http:\/\/www.52cdd.com\/Butler\/data\/attachment\/image\/20160823\/1010aecf50b12c9827c5a00d7132eae8.jpg",
"IS_VOUCH": "1"
},
{
"ITEM_ID": "55",
"ITEM_NAME": "壳牌(灰喜力)5W-30全合成机油 7L ",
"PRICE": "614",
"IMG_URL": "http:\/\/www.52cdd.com\/Butler\/data\/attachment\/image\/20160823\/1010aecf50b12c9827c5a00d7132eae8.jpg",
"IS_VOUCH": "1"
},
{
"ITEM_ID": "982",
"ITEM_NAME": "俄罗斯原装进口5W-40合成机油 7L",
"PRICE": "508",
"IMG_URL": "http:\/\/www.52cdd.com\/Butler\/data\/attachment\/image\/20160823\/1010aecf50b12c9827c5a00d7132eae8.jpg",
"IS_VOUCH": "1"
},
{
"ITEM_ID": "1646",
"ITEM_NAME": "俄罗斯原装进口5W-30全合成机油 7L",
"PRICE": "764",
"IMG_URL": "http:\/\/www.52cdd.com\/Butler\/data\/attachment\/image\/20160823\/1010aecf50b12c9827c5a00d7132eae8.jpg",
"IS_VOUCH": "1"
},
{
"ITEM_ID": "",
"ITEM_NAME": null,
"PRICE": "764",
"IMG_URL": "http:\/\/www.52cdd.com\/Butler\/data\/attachment\/image\/20160823\/1010aecf50b12c9827c5a00d7132eae8.jpg",
"IS_VOUCH": "1"
},
{
"ITEM_ID": "",
"ITEM_NAME": null,
"PRICE": "508",
"IMG_URL": "http:\/\/www.52cdd.com\/Butler\/data\/attachment\/image\/20160823\/1010aecf50b12c9827c5a00d7132eae8.jpg",
"IS_VOUCH": "1"
}
]
},
{
"IS_VISIT": "0",
"ITEM_ID": "2",
"ITEM_NAME": "机油滤清器",
"INTRO": "推荐5000公里修理一次\/6个月",
"PRICE": "100",
"ITEM_STATUS": "1",
"ITEM_TYPE": "1",
"ITEMS": [
{
"ITEM_ID": "0",
"ITEM_NAME": "暂无此配件,请致电4008200260",
"PRICE": "0",
"IMG_URL": "",
"IS_VOUCH": "1"
}
]
},
{
"IS_VISIT": "0",
"ITEM_ID": "5",
"ITEM_NAME": "空气滤清器",
"INTRO": "推荐5000公里修理一次\/6个月",
"PRICE": "100",
"ITEM_STATUS": "1",
"ITEM_TYPE": "1",
"ITEMS": [
{
"ITEM_ID": "0",
"ITEM_NAME": "暂无此配件,请致电4008200260",
"PRICE": "0",
"IMG_URL": "",
"IS_VOUCH": "1"
}
]
},
{
"IS_VISIT": "1",
"ITEM_ID": "6",
"ITEM_NAME": "火花塞",
"INTRO": "推荐5000公里修理一次\/6个月",
"PRICE": "80",
"ITEM_STATUS": "3",
"ITEM_TYPE": "2",
"ITEMS": [
{
"ITEM_ID": "0",
"ITEM_NAME": "暂无此配件,请致电4008200260",
"PRICE": "0",
"IMG_URL": "",
"IS_VOUCH": "1"
}
]
},
{
"IS_VISIT": "1",
"ITEM_ID": "8",
"ITEM_NAME": "刹车油",
"INTRO": "推荐5000公里修理一次\/6个月",
"PRICE": "100",
"ITEM_STATUS": "3",
"ITEM_TYPE": "2",
"ITEMS": [
{
"ITEM_ID": "0",
"ITEM_NAME": "暂无此配件,请致电4008200260",
"PRICE": "0",
"IMG_URL": "",
"IS_VOUCH": "1"
}
]
},
{
"IS_VISIT": "1",
"ITEM_ID": "7",
"ITEM_NAME": "变速箱油",
"INTRO": "推荐5000公里修理一次\/6个月",
"PRICE": "100",
"ITEM_STATUS": "3",
"ITEM_TYPE": "2",
"ITEMS": [
{
"ITEM_ID": "0",
"ITEM_NAME": "暂无此配件,请致电4008200260",
"PRICE": "0",
"IMG_URL": "",
"IS_VOUCH": "1"
}
]
}
]
}
}
整的代码块
有问题的数据输出
没有问题的数据输出
这个问题已被关闭,原因:问题已解决 - 问题已解决,且对他人无借鉴意义
解决方案
用了比较新的语法,其中 find()
函数如果不支持可以自己用循环实现。
const needItem = [];
const serverItem = [];
const all = {
"1": needItem,
"2": serverItem
};
data.RESULT.NEED_ITEM.forEach(item => {
all[item.ITEM_TYPE].push(item);
});
console.log(needItem);
console.log("------------");
console.log(serverItem);
needItem.forEach(item => {
const found = item.ITEMS.find(t => t.IS_VOUCH == 1);
if (found) {
item.VOUCH_ITEM = found;
}
});
console.log("------------");
console.log(needItem);
这篇关于html5 - Vue 2.0 javaScript 数组循环push json 对象问题的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文