سلام. من یه لیست از آیتم ها به فرمت 01A02 داشتم که اونها رو به صورت یه آرایه ای از آبجکت درآوردم که هر سه قسمتش از هم جداس
: {aisle: 1, side: "A", bay: 1}
2: {aisle: 1, side: "A", bay: 2}
3: {aisle: 1, side: "A", bay: 3}
4: {aisle: 1, side: "A", bay: 4}
5: {aisle: 1, side: "A", bay: 5}
6: {aisle: 2, side: "A", bay: 1}
7: {aisle: 2, side: "A", bay: 2}
8: {aisle: 2, side: "A", bay: 3}
9: {aisle: 2, side: "A", bay: 4}
10: {aisle: 2, side: "A", bay: 5}
11: {aisle: 2, side: "B", bay: 1}
12: {aisle: 2, side: "B", bay: 2}
13: {aisle: 2, side: "B", bay: 3}
14: {aisle: 2, side: "B", bay: 4}
15: {aisle: 2, side: "B", bay: 5}
16: {aisle: 3, side: "B", bay: 1}
17: {aisle: 3, side: "B", bay: 2}
18: {aisle: 3, side: "B", bay: 3}
19: {aisle: 3, side: "B", bay: 4}
20: {aisle: 3, side: "B", bay: 5}
الان میخوام این آرایه رو به صورتی تغییر بدم که بتونم اون رو توی لیست درختی خودم نمایش بدم. برای این کار نیاز دارم به همچین آرایه ای:
[{aisle:1 , children:[ {side :'A', children:[{bay:1,bay:2}]}, {side :'B', children:[{bay:1,bay:2}]}]},
{aisle:2 , children:[ {side :'A', children:[{bay:1,bay:2}]}, {side :'B', children:[{bay:1,bay:2}]}]}]
ممنون میشم کمکم کنید اون آرایه رو به آرایه ای که میخوام تبدیل کنم؟
@sinashahoveisi
این کد تکمیل شدهی کد قبله. تست شده و درست کرده.
import * as React from "react";
import _ from "lodash";
function App() {
let locationArr = [
{ aisle: 1, side: "A", bay: 1 },
{ aisle: 1, side: "A", bay: 2 },
{ aisle: 1, side: "A", bay: 3 },
{ aisle: 1, side: "A", bay: 4 },
{ aisle: 1, side: "A", bay: 5 },
{ aisle: 2, side: "A", bay: 1 },
{ aisle: 2, side: "A", bay: 2 },
{ aisle: 2, side: "A", bay: 3 },
{ aisle: 2, side: "A", bay: 4 },
{ aisle: 2, side: "A", bay: 5 },
{ aisle: 2, side: "B", bay: 1 },
{ aisle: 2, side: "B", bay: 2 },
{ aisle: 2, side: "B", bay: 3 },
{ aisle: 2, side: "B", bay: 4 },
{ aisle: 2, side: "B", bay: 5 },
{ aisle: 3, side: "B", bay: 1 },
{ aisle: 3, side: "B", bay: 2 },
{ aisle: 3, side: "B", bay: 3 },
{ aisle: 3, side: "B", bay: 4 },
{ aisle: 3, side: "B", bay: 5 },
];
///use lodash
const aisles = _.uniq(locationArr.map((item) => item.aisle)); /// must returen [1,2,3,4]
console.log(aisles);
let newArrStep1 = aisles.map((aisle) => {
console.log(aisle);
let step1Obj = { aisle, children: [] };
locationArr.reduce((accumulator, currentValue) => {
if (currentValue.aisle === aisle) {
step1Obj.children.push({
side: currentValue.side,
bay: currentValue.bay,
});
}
return step1Obj;
}, step1Obj);
return step1Obj;
});
console.log(newArrStep1);
let newArrStep2 = newArrStep1.map((item) => {
const sides = _.uniq(item.children.map((child) => child.side)); /// must returen [A] or [A, B]
console.log(sides)
let finalObj = sides.map((side) => {
let step1Obj = { side, children: [] };
item.children.reduce((accumulator, currentValue) => {
if (currentValue.side === side) {
step1Obj.children.push({
bay: currentValue.bay,
});
}
return step1Obj;
}, step1Obj);
return step1Obj;
});
return {aisle:item.aisle,children: finalObj}
});
console.log(newArrStep2)
return "convert arrey to tree structured";
}
export default App;
مسئله بسیار قشنگیه. بخشی از مسئله رو حل کردم و شما باید این کد رو توسعه بدین تا مسئله به طور کامل حل بشه.
import * as React from "react";
import "./App.css";
import _ from "lodash";
function App() {
let locationArr = [
{aisle: 1, side: "A", bay: 1},
{aisle: 1, side: "A", bay: 2},
{aisle: 1, side: "A", bay: 3},
{aisle: 1, side: "A", bay: 4},
{aisle: 1, side: "A", bay: 5},
{aisle: 2, side: "A", bay: 1},
{aisle: 2, side: "A", bay: 2},
{aisle: 2, side: "A", bay: 3},
{aisle: 2, side: "A", bay: 4},
{aisle: 2, side: "A", bay: 5},
{aisle: 2, side: "B", bay: 1},
{aisle: 2, side: "B", bay: 2},
{aisle: 2, side: "B", bay: 3},
{aisle: 2, side: "B", bay: 4},
{aisle: 2, side: "B", bay: 5},
{aisle: 3, side: "B", bay: 1},
{aisle: 3, side: "B", bay: 2},
{aisle: 3, side: "B", bay: 3},
{aisle: 3, side: "B", bay: 4},
{aisle: 3, side: "B", bay: 5}
]
///use lodash
const aisles = _.uniq(locationArr.map(item => item.aisle)); /// must returen [1,2,3,4]
console.log(aisles)
let newArrStep1 = aisles.map((aisle) => {
console.log(aisle)
let step1Obj = { aisle, children: [] };
locationArr.reduce((accumulator, currentValue) => {
if (currentValue.aisle === aisle) {
step1Obj.children.push({
side: currentValue.side,
bay: currentValue.bay,
});
}
return step1Obj
}, step1Obj);
return step1Obj});
console.log(newArrStep1)
return('covert arrey to tree structured')
}
export default App;
خیلی سپاس گزار خواهم بود که جواب نهایی رو همینجا به اشتراک بزارین.
نتیجه console.log(newArrStep۲)
در کد بالا به شکل زیر هست:
[
{
"aisle": 1,
"children": [
{"side": "A", "bay": 1 },
{"side": "A", "bay": 2 },
{"side": "A", "bay": 3 },
{"side": "A", "bay": 4 },
{"side": "A", "bay": 5 }
]
},
{
"aisle": 2,
"children": [
{"side": "A", "bay": 1 },
{"side": "A", "bay": 2 },
{"side": "A", "bay": 3 },
{"side": "A", "bay": 4 },
{"side": "A", "bay": 5 },
{"side": "B", "bay": 1 },
{"side": "B", "bay": 2 },
{"side": "B", "bay": 3 },
{"side": "B", "bay": 4 },
{"side": "B", "bay": 5 }
]
},
{
"aisle": 3,
"children": [
{"side": "B", "bay": 1 },
{"side": "B", "bay": 2 },
{"side": "B", "bay": 3 },
{"side": "B", "bay": 4 },
{"side": "B", "bay": 5 }
]
}
]
این کد تکمیل شدهی کد قبله. تست شده و درست کرده.
import * as React from "react";
import _ from "lodash";
function App() {
let locationArr = [
{ aisle: 1, side: "A", bay: 1 },
{ aisle: 1, side: "A", bay: 2 },
{ aisle: 1, side: "A", bay: 3 },
{ aisle: 1, side: "A", bay: 4 },
{ aisle: 1, side: "A", bay: 5 },
{ aisle: 2, side: "A", bay: 1 },
{ aisle: 2, side: "A", bay: 2 },
{ aisle: 2, side: "A", bay: 3 },
{ aisle: 2, side: "A", bay: 4 },
{ aisle: 2, side: "A", bay: 5 },
{ aisle: 2, side: "B", bay: 1 },
{ aisle: 2, side: "B", bay: 2 },
{ aisle: 2, side: "B", bay: 3 },
{ aisle: 2, side: "B", bay: 4 },
{ aisle: 2, side: "B", bay: 5 },
{ aisle: 3, side: "B", bay: 1 },
{ aisle: 3, side: "B", bay: 2 },
{ aisle: 3, side: "B", bay: 3 },
{ aisle: 3, side: "B", bay: 4 },
{ aisle: 3, side: "B", bay: 5 },
];
///use lodash
const aisles = _.uniq(locationArr.map((item) => item.aisle)); /// must returen [1,2,3,4]
console.log(aisles);
let newArrStep1 = aisles.map((aisle) => {
console.log(aisle);
let step1Obj = { aisle, children: [] };
locationArr.reduce((accumulator, currentValue) => {
if (currentValue.aisle === aisle) {
step1Obj.children.push({
side: currentValue.side,
bay: currentValue.bay,
});
}
return step1Obj;
}, step1Obj);
return step1Obj;
});
console.log(newArrStep1);
let newArrStep2 = newArrStep1.map((item) => {
const sides = _.uniq(item.children.map((child) => child.side)); /// must returen [A] or [A, B]
console.log(sides)
let finalObj = sides.map((side) => {
let step1Obj = { side, children: [] };
item.children.reduce((accumulator, currentValue) => {
if (currentValue.side === side) {
step1Obj.children.push({
bay: currentValue.bay,
});
}
return step1Obj;
}, step1Obj);
return step1Obj;
});
return {aisle:item.aisle,children: finalObj}
});
console.log(newArrStep2)
return "convert arrey to tree structured";
}
export default App;
نتیجه console.log(newArrStep2)
در کد بالا به این شکله:
[
{
"aisle": 1,
"children": [
{
"side": "A",
"children": [
{ "bay": 1 },
{ "bay": 2 },
{ "bay": 3 },
{ "bay": 4 },
{ "bay": 5 }
]
}
]
},
{
"aisle": 2,
"children": [
{
"side": "A",
"children": [
{ "bay": 1 },
{ "bay": 2 },
{ "bay": 3 },
{ "bay": 4 },
{ "bay": 5 }
]
},
{
"side": "B",
"children": [
{ "bay": 1 },
{ "bay": 2 },
{ "bay": 3 },
{ "bay": 4 },
{ "bay": 5 }
]
}
]
},
{
"aisle": 3,
"children": [
{
"side": "B",
"children": [
{ "bay": 1 },
{ "bay": 2 },
{ "bay": 3 },
{ "bay": 4 },
{ "bay": 5 }
]
}
]
}
]
آیا مایل به ارسال نوتیفیکیشن و اخبار از طرف راکت هستید ؟