Parastoo Ebrahimi
4 سال پیش توسط Parastoo Ebrahimi مطرح شد
4 پاسخ

فیلتر در multilevel array

سلام . من یه آرایه به صورت زیر دارم. میخوام با یه text اون رو فیلتر کنم. برای سطح اول کدم کار میکنه. ولی نمیدونم برای اینکه دو سطح دیگه هم فیلتر کنم باید چیکار کنم.
این فیلتر برای آیتم های یک منو هستش. مثلا وقتی stock رو سرچ میکنم باید اون آیتم نمایش داده بشه.
my menu

menuItem=[{name:"item 1", children:[{name:"my text"}, {name:"item 1-2", children:[{name:"my text"}]} ]},{name:"item2", children:[{name:"my text"}, {name:"2-2"}]

ریزالتی که میخوام داشته باشم اگر text وجود داشت اینه:

menuItem=[{name:"item 1", children:[{name:"my text"}, {name:"item 1-2", children:[{name:"my text"}]} ]},{name:"item2", children:[{name:"my text"}]}]

کدی که برای سطح اول کار میکنه :

let filtered = this.props.menuItem;
        if (this.props.searchInput) {
            debugger
            filtered = filtered.filter(item => item.name.toLowerCase().includes(this.props.searchInput.toLowerCase()));
        }

@kamran.davar
@sinashahoveisi


ثبت پرسش جدید
Parastoo Ebrahimi
تخصص : front-end developer
@parastooebrahimi 4 سال پیش مطرح شد
2

@kamran.davar
@itstaha
خب بالاخره نوشتمش و جواب هم گرفتم ازش. کدم به صورت زیر شد :

    let filtered = this.props.menuItem;
        let result = [];
        let parentIndex = -1;
        let childrenResult = [];
        let name;
        let icon;
        let level= null
        if (this.props.searchInput) {
            filtered.forEach(item => {
                if (item.name.toLowerCase().includes(this.props.searchInput.toLowerCase())) {

                }
                else if (item.children) {
                    level= item.name
                    name = item.name;
                    icon = item.icon;
                    item.children.forEach(element => {
                        if (element.name.toLowerCase().includes(this.props.searchInput.toLowerCase())) {
                            parentIndex = parentIndex + 1;
                            childrenResult.push(element);
                            let child = [];
                            child.push(childrenResult[parentIndex])
                            result.push({ name, icon, children: child });
                        }
                    });
                }
            });  
            result = result.reduce((result, entry) => {
                // Find if there is a duplicate in the new array
                const duplicate = result.find(newEntry => (
                  entry.name === newEntry.name 
                ));

                // If there is a duplicate, merge their stroyids
                if (duplicate) {
                  const name = entry.children.filter(id => !duplicate.children.includes(id));
                  duplicate.children = duplicate.children.concat(name);
                }
                else result.push(entry); // Else, add the entire entry

                return result;
              }, []);

              console.log(result);
        }       

            if(this.props.searchInput){
                filtered = result;
            }

فقط یه قسمتشو از استک اور فلو کمک گرفتم و نوشتم و نفهمیدم چی کار میکنه!!!
این قسمتش:

result = result.reduce((result, entry) => {
                // Find if there is a duplicate in the new array
                const duplicate = result.find(newEntry => (
                  entry.name === newEntry.name 
                ));

                // If there is a duplicate, merge their stroyids
                if (duplicate) {
                  const name = entry.children.filter(id => !duplicate.children.includes(id));
                  duplicate.children = duplicate.children.concat(name);
                }
                else result.push(entry); // Else, add the entire entry

                return result;
              }, []);

              console.log(result);

Taha
تخصص : طراح و توسعه دهنده وب
@itstaha 4 سال پیش مطرح شد
1

سلام، این لینک رو چک کنید احتمالا مشکلتون رو حل میکنه.
https://stackoverflow.com/questions/47823734/using-array-filter-down-multiple-levels


کامران داور
تخصص : Front-end developer
@kamran.davar 4 سال پیش مطرح شد
1

javascript-recursive-function
رستگاری توی این لینکه


Parastoo Ebrahimi
تخصص : front-end developer
@parastooebrahimi 4 سال پیش مطرح شد
0

@kamran.davar
@itstaha
ممنونم از راهنمایی هاتون . الان یه مشکلی که دارم اینه که وقتی فیلتر میخوام بکنم اون child ای که فیلتر میشه من پرنتسشو هم میخوام ولی نمیدونم چجوری باید اونو فیلتر کنم. مثلا فرض اینکه محتویات آرایه ای که فیلتر شده به صورت زیر باشه:

{name: "Reports", id: "1", icon: "fa-fw fas fa-file-alt", children: Array(31)}

الان مثلا این 31 آیتم به عنوان چایلد داره. من مثلا فقط چایلد اولو میخوام . چه باید بکنم ؟


Parastoo Ebrahimi
تخصص : front-end developer
@parastooebrahimi 4 سال پیش مطرح شد
2

@kamran.davar
@itstaha
خب بالاخره نوشتمش و جواب هم گرفتم ازش. کدم به صورت زیر شد :

    let filtered = this.props.menuItem;
        let result = [];
        let parentIndex = -1;
        let childrenResult = [];
        let name;
        let icon;
        let level= null
        if (this.props.searchInput) {
            filtered.forEach(item => {
                if (item.name.toLowerCase().includes(this.props.searchInput.toLowerCase())) {

                }
                else if (item.children) {
                    level= item.name
                    name = item.name;
                    icon = item.icon;
                    item.children.forEach(element => {
                        if (element.name.toLowerCase().includes(this.props.searchInput.toLowerCase())) {
                            parentIndex = parentIndex + 1;
                            childrenResult.push(element);
                            let child = [];
                            child.push(childrenResult[parentIndex])
                            result.push({ name, icon, children: child });
                        }
                    });
                }
            });  
            result = result.reduce((result, entry) => {
                // Find if there is a duplicate in the new array
                const duplicate = result.find(newEntry => (
                  entry.name === newEntry.name 
                ));

                // If there is a duplicate, merge their stroyids
                if (duplicate) {
                  const name = entry.children.filter(id => !duplicate.children.includes(id));
                  duplicate.children = duplicate.children.concat(name);
                }
                else result.push(entry); // Else, add the entire entry

                return result;
              }, []);

              console.log(result);
        }       

            if(this.props.searchInput){
                filtered = result;
            }

فقط یه قسمتشو از استک اور فلو کمک گرفتم و نوشتم و نفهمیدم چی کار میکنه!!!
این قسمتش:

result = result.reduce((result, entry) => {
                // Find if there is a duplicate in the new array
                const duplicate = result.find(newEntry => (
                  entry.name === newEntry.name 
                ));

                // If there is a duplicate, merge their stroyids
                if (duplicate) {
                  const name = entry.children.filter(id => !duplicate.children.includes(id));
                  duplicate.children = duplicate.children.concat(name);
                }
                else result.push(entry); // Else, add the entire entry

                return result;
              }, []);

              console.log(result);

برای ارسال پاسخ لازم است وارد شده یا ثبت‌نام کنید

ورود یا ثبت‌نام