1

Есть 3 кнопки в окне, по нажатию на которые происходит сортировка продуктов:

const sortHandler = (name: any, idx: number): void => {
    switch (name) {
            case EProductSort.popular: // популярности
                setProducts(products);
                break;
            case EProductSort.price: // цене
                const sortProductsByPrice = products.sort((a: any, b: any) => {
                    return a.price - b.price;
                });
                setProducts(sortProductsByPrice);
                break;
            case EProductSort.alphabet: // алфавиту
                const sortProductsByAlphabet = products.sort((a: any, b: any) => {
                    if (a.name > b.name) return 1;
                    return 0;
                });
                setProducts(sortProductsByAlphabet);
                break;
            default:
                setProducts(list);
                break;
        }
    };

setProducts и products передаются в props:

<Filter setProducts={setProducts} products={products} />

const { list } = useSelector((state: IState) => state.products);
const [products, setProducts] = React.useState<Array<IProduct>>(list);

Когда нажимаю на кнопки, то попадаю в определенный case, там проверяю массивы, которые корректно отсортированы, но состояние продуктов не обновляется

1

1 ответ 1

1

Метод sort() не создает новый объект Array, а производит сортировку переданного массива.

Как вариант - просто сделать "другой" массив из "старого", но отсортированного.

const sortHandler = (name: any, idx: number): void => {
    switch (name) {
            case EProductSort.popular: // популярности
                setProducts([...products]);
                break;
            case EProductSort.price: // цене
                const sortProductsByPrice = products.sort((a: any, b: any) => {
                    return a.price - b.price;
                });
                setProducts([...sortProductsByPrice]);
                break;
            case EProductSort.alphabet: // алфавиту
                const sortProductsByAlphabet = products.sort((a: any, b: any) => {
                    if (a.name > b.name) return 1;
                    return 0;
                });
                setProducts([...sortProductsByAlphabet]);
                break;
            default:
                setProducts([...list]);
                break;
        }
    };

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.