Tengo dos matrices:
const dropdownOptions = [ { text: 'NuxtJS', sortOrder: 1 }, { text: 'VueJS', sortOrder: 2 }, ]Y:
const sidebar = [ { text: 'VueJS', collapsible: true, items: [ [Object], [Object], [Object], [Object], [Object] ] }, { text: 'NuxtJS', collapsible: true, items: [ [Object], [Object], [Object], [Object] ] } ] Me gustaría ordenar la variable de la barra lateral según el valor sortOrder dentro de la matriz dropdownOptions. Entonces, para este ejemplo, el resultado esperado sería:
const sortedSidebar = [ { text: 'NuxtJS', collapsible: true, items: [ [Object], [Object], [Object], [Object] ] }, { text: 'VueJS', collapsible: true, items: [ [Object], [Object], [Object], [Object], [Object] ] } ]Primero puede convertir sus dropdownOptions en un mapa que asocie cada text /elemento con un pedido para una búsqueda rápida y fácil. A continuación, lo hice creando un Map usando .map() en dropdownOptions , pero si puede cambiar la estructura de datos de dropdownOptions , entonces puede evitar este paso y construir el Mapa directamente. Una vez que tenga el Mapa, puede usar .sort() en la diferencia de los órdenes para reorganizar su matriz en orden ascendente según la propiedad sortOrder contenida en el Mapa.
Vea el ejemplo de trabajo a continuación:
const dropdownOptions = [ { text: 'NuxtJS', sortOrder: 1 }, { text: 'VueJS', sortOrder: 2 }, ]; const sidebar = [ { text: 'VueJS', collapsible: true, items: [] }, { text: 'NuxtJS', collapsible: true, items: [] } ]; const sortMap = new Map(dropdownOptions.map((obj) => [obj.text, obj.sortOrder])); const sortedSidebar = sidebar.slice().sort((a, b) => sortMap.get(a.text) - sortMap.get(b.text)); console.log(sortedSidebar);tal vez algo como...
const dropdownOptionsMap = dropdownOptions.reduce((a,v)=>{ a[v.text]=v; return a; },{}); const sortedSidebar = sidebar.slice().sort((a,b) => { return dropdownOptionsMap[a.text].sortOrder - dropdownOptionsMap[b.text]; });