Classificar dados em ordem alfabética a partir da matriz, dando alfabeto rótulo para vários itens reactjs?

Question 1

Estou criando uma próxima js aplicação. Aqui, tenho de tipo de dados de matriz por ordem alfabética e eu tenho que dar também alfabeto rótulo. Como posso fazer isso?

Exemplo: eu tenho uma Matriz

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

Eu tenho aqui para mostrar como ...

A
Apple

I
Itel

O
Oppo

S
Samsung
Siam
Sumia

T
Tackro
Techno

X
Xiomi

Com Alfabeto rótulo..

Aqui é os 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

O que você pode fazer é,

primeiro grupo de telefones baseados em sua primeira carta
em seguida, o grupo de sábios tipo de dados de cada letra
Durante o processamento, você pode mostrar o Alfabeto Rótulo como index of array+'A'e lançá-lo as character & mostrar apenas aqueles alfabeto grupo com duração>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: pode ver a saída real executando no console do seu browser.

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

O que você pode fazer é,

primeiro grupo de telefones baseados em sua primeira carta
em seguida, o grupo de sábios tipo de dados de cada letra
Durante o processamento, você pode mostrar o Alfabeto Rótulo como index of array+'A'e lançá-lo as character & mostrar apenas aqueles alfabeto grupo com duração>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: pode ver a saída real executando no console do seu browser.

Como posso mostrar o alfabeto rótulo (A, B, C, D) em reagir componente?
Eles já são classificados como temos tido uma array of size 26 Um -> índice de 0, B> 1 índice, C -> 2 índice . . . .
Em reagir, você pode lidar com a renderização usando apenas a lógica mencionado no 3º ponto na resposta.

Classificar dados em ordem alfabética a partir da matriz, dando alfabeto rótulo para vários itens reactjs?

Pergunta

Melhor resposta

Em outros idiomas

Esta página está em outros idiomas

Popular nesta categoria

Perguntas populares nesta categoria