Ordenar los datos en orden alfabético a partir de la matriz, dando alfabeto etiqueta para varios elementos reactjs?

Question 1

Estoy creando una próxima js aplicación. Aquí tengo que ordenar los datos de la matriz por orden alfabético y tengo que dar también el alfabeto de la etiqueta. ¿Cómo puedo hacer eso?

Ejemplo: tengo un Array-

export default [
    { name: "Xioami" },
    { name: "Samsung" },
    { name: "Sumia" },
    { name: "Siam" },
    { name: "Tackro" },
    { name: "Apple" },
    { name: "Oppo" },
    { name: "Techno" },
    { name: "Itel" },
]

Aquí tengo que mostrar como--

A
Apple

I
Itel

O
Oppo

S
Samsung
Siam
Sumia

T
Tackro
Techno

X
Xiomi

Con el Alfabeto de la etiqueta..

Aquí es el de los componentes

//Data
import BrandData from "Data/Header/Brand.Data";

const Brand = ({ setFilterData, filterData }) => {
    return (
        <List className={classes.List}>
            {brands &&
                brands.map((brand, i) => (
                    <ListItem key={i}>
                        {brand.name}
                    </ListItem>
                ))
            }
        </List>
    );
};
export default Brand;

Question 2

Lo que puedes hacer es,

primer grupo de teléfonos basados en su primera carta
a continuación, el grupo sabio ordenar los datos de cada letra
Mientras que la representación, puede mostrar el Alfabeto de la Etiqueta como index of array+'A'y lo echó as character & mostrar sólo aquellos alfabeto grupo que tienen una longitud>0

     

const arr = [
    { name: "Xioami" },
    { name: "Samsung" },
    { name: "Apple" },
    { name: "Oppo" },
    { name: "Techno" },
    { name: "Itel" },
    { name: "Samsung1" },
    { name: "Apple1" },
    { name: "Apple2" },
    { name: "Oppo1" },
    { name: "Oppo2" },
    { name: "Oppo3" },
    { name: "Itel1" },
]

let alphabeticallyGrouped = [...Array(26)].fill([])

arr.forEach((phone) => {
    let index = phone.name[0].charCodeAt(0) - 'A'.charCodeAt(0);
    alphabeticallyGrouped[index] = [...alphabeticallyGrouped[index],phone]
});

const alphabeticallySorted = [...alphabeticallyGrouped].map(group => group.sort());

console.log(alphabeticallySorted)

Nota: puede ver el resultado real que se ejecutan en el navegador de la consola.

Himanshu Singh · Answer 1 · 2021-11-23T18:27:12

Lo que puedes hacer es,

primer grupo de teléfonos basados en su primera carta
a continuación, el grupo sabio ordenar los datos de cada letra
Mientras que la representación, puede mostrar el Alfabeto de la Etiqueta como index of array+'A'y lo echó as character & mostrar sólo aquellos alfabeto grupo que tienen una longitud>0

     

const arr = [
    { name: "Xioami" },
    { name: "Samsung" },
    { name: "Apple" },
    { name: "Oppo" },
    { name: "Techno" },
    { name: "Itel" },
    { name: "Samsung1" },
    { name: "Apple1" },
    { name: "Apple2" },
    { name: "Oppo1" },
    { name: "Oppo2" },
    { name: "Oppo3" },
    { name: "Itel1" },
]

let alphabeticallyGrouped = [...Array(26)].fill([])

arr.forEach((phone) => {
    let index = phone.name[0].charCodeAt(0) - 'A'.charCodeAt(0);
    alphabeticallyGrouped[index] = [...alphabeticallyGrouped[index],phone]
});

const alphabeticallySorted = [...alphabeticallyGrouped].map(group => group.sort());

console.log(alphabeticallySorted)

Nota: puede ver el resultado real que se ejecutan en el navegador de la consola.

¿Cómo puedo mostrar el alfabeto de la etiqueta (a, B, C, D) en reaccionar componente?
Ya están ordenados como hemos tomado una array of size 26 A -> 0 índice, B -> 1 índice, C -> 2 índice . . . .
En reaccionar, usted puede manejar la representación sólo por el uso de la lógica mencionados en el 3er punto en la respuesta.

Ordenar los datos en orden alfabético a partir de la matriz, dando alfabeto etiqueta para varios elementos reactjs?

Pregunta

Mejor respuesta

En otros idiomas

Esta página está en otros idiomas

Popular en esta categoría

Las preguntas más habituales en esta categoría