?一、原始數(shù)據(jù)

這里定義為五個數(shù)組，種類product有aaa,bbb兩種

原始數(shù)據(jù)在data中進(jìn)行定義

res: {
	"success": true,
	"devices": [{
			no: 0,
			product: 'aaa',
			alias: "設(shè)備1",
			assign: [
				["a1", "a2", "a3"],
				["a11", "a22", "a33"],
				["a111", "a222", "a333"]
			]
		},
		{
			no: 1,
			product: 'bbb',
			alias: "設(shè)備2",
			assign: [
				["b1", "b2", "b3"],
				["b11", "b22", "b33"],
				["b111", "b222", "b333"],
				["b1111", "b2222", "b3333"]
			]
		},
		{
			no: 2,
			product: 'aaa',
			alias: "設(shè)備3",
			assign: [
				["a1", "a2", "a3"],
				["a111", "a222", "a333"],
				["a11", "b22", "c33"]
			]
		},
		{
			no: 3,
			product: 'aaa',
			alias: "設(shè)備4",
			assign: [
				["a11", "b22", "c33"],
				["a1", "a2", "a3"],
				["a111", "a222", "a333"]

			]
		},
		{
			no: 4,
			product: 'bbb',
			alias: "設(shè)備5",
			assign: [
				["b111", "b222", "b333"],
				["b1", "b2", "b3"],
				["b11", "b22", "b33"],
				["b1111", "b2222", "b3333"]

			]
		},
	]
},

二、分類處理數(shù)據(jù)

注：使用了數(shù)組的 reduce() 方法來對 devices 數(shù)組進(jìn)行循環(huán)遍歷，并根據(jù)每個設(shè)備對象中的 product 值將其分類到一個以 product 為名稱的數(shù)組中。

• reduce() 方法接收一個回調(diào)函數(shù)和一個初始值作為參數(shù)。在這里，初始值是一個空對象 {}。

• 回調(diào)函數(shù)有兩個參數(shù)：累加器（acc）和當(dāng)前迭代的元素（device）。

• 在每次迭代中，獲取當(dāng)前設(shè)備對象的 product 值并保存在變量 product 中。

• 接下來，通過檢查累加器對象 acc 中是否存在以 product 值為名稱的屬性，來判斷是否已經(jīng)有與該 product 對應(yīng)的數(shù)組。

• 如果不存在，則創(chuàng)建一個新的空數(shù)組，并將其添加為累加器對象 acc 的屬性之一，使用 product 值作為屬性名。

• 然后，將當(dāng)前的設(shè)備對象 device 添加到對應(yīng)的 product 數(shù)組中，使用 push() 方法將設(shè)備對象推入數(shù)組中。

• 最后，在每次迭代結(jié)束時，返回累加器對象 acc，以便在下一次迭代中使用。

• 當(dāng)所有元素都被迭代完畢后，reduce() 方法將返回最終累加器對象 acc，其中包含了以 product 值為名稱的數(shù)組。

//根據(jù)product的名稱進(jìn)行分類處理
const devices = this.res.devices;
const result = devices.reduce((acc, device) => {
	const product = device.product;			
	// 檢查結(jié)果中是否已存在相同 product 的數(shù)組，如果不存在則創(chuàng)建一個新數(shù)組
	if (!acc[product]) {
		acc[product] = [];
	}			
	// 將當(dāng)前設(shè)備對象添加到對應(yīng)的 product 數(shù)組中
	acc[product].push(device);			
	return acc;
}, {});		

?文章來源地址http://www.zghlxwxcb.cn/news/detail-723949.html

三、完整代碼

<template>
	<view>
	</view>
</template>
<script>
	export default {
		data() {
			return {
				res: {
					"success": true,
					"devices": [{
							no: 0,
							product: 'aaa',
							alias: "設(shè)備1",
							assign: [
								["a1", "a2", "a3"],
								["a11", "a22", "a33"],
								["a111", "a222", "a333"]
							]
						},
						{
							no: 1,
							product: 'bbb',
							alias: "設(shè)備2",
							assign: [
								["b1", "b2", "b3"],
								["b11", "b22", "b33"],
								["b111", "b222", "b333"],
								["b1111", "b2222", "b3333"]
							]
						},
						{
							no: 2,
							product: 'aaa',
							alias: "設(shè)備3",
							assign: [
								["a1", "a2", "a3"],
								["a111", "a222", "a333"],
								["a11", "b22", "c33"]
							]
						},
						{
							no: 3,
							product: 'aaa',
							alias: "設(shè)備4",
							assign: [
								["a11", "b22", "c33"],
								["a1", "a2", "a3"],
								["a111", "a222", "a333"]

							]
						},
						{
							no: 4,
							product: 'bbb',
							alias: "設(shè)備5",
							assign: [
								["b111", "b222", "b333"],
								["b1", "b2", "b3"],
								["b11", "b22", "b33"],
								["b1111", "b2222", "b3333"]

							]
						},
					]
				},
				
			}
		},
		methods: {

		},
		onLoad() {
			console.log('初始數(shù)據(jù)')
			console.log(this.res.devices)
			//根據(jù)product的名稱進(jìn)行分類處理
			const devices = this.res.devices;
			const result = devices.reduce((acc, device) => {
				const product = device.product;			
				// 檢查結(jié)果中是否已存在相同 product 的數(shù)組，如果不存在則創(chuàng)建一個新數(shù)組
				if (!acc[product]) {
					acc[product] = [];
				}			
				// 將當(dāng)前設(shè)備對象添加到對應(yīng)的 product 數(shù)組中
				acc[product].push(device);			
				return acc;
			}, {});		
			console.log('分類后的數(shù)據(jù)')
			console.log(result);
		}
	};
</script>
<style>

</style>

到了這里，關(guān)于uni-app：對數(shù)組對象進(jìn)行以具體某一項的分類處理的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！