0

Есть состояние:

const [opNames, setOpNames] = useState(
        props.brand.map((item) => {
            return { checked: false, name: item, id: item };
        })
    );

В пропсе бренд содержится массив, который парсится в объект. Мне нужно его обновить с помощью хука useEffect, но такой вариант:

useEffect(() => {
            setOpNames(props.brand.map((item) => {
                return {checked: false, name: item, id: item};
            }));
    });

или оборачивание в функцию приводят к бесконечным вызовам. Как сделать так, чтобы состояние обновлялось только 1 раз?

P.s. - Попробовал сделать вот так:

useEffect(() => {
            function newData () {
                let brand = props.brand;
                setOpNames(brand.map((item) => {
                    return {checked: false, name: item, id: item};
                }));
            }
            newData();
    }, [props.brand]);

Но получаю страшные высыпания в консоли, значения которых не понимаю:

введите сюда описание изображения

Хоть по факту все и работает, я бы предпочел это убрать.

1 ответ 1

0

Ну ошибка не связана с хуком, если вам нужно отслеживать brend, передавайте вторым параметром в useEffect [props.brand]. Если надо просто один раз выполнить при монтаже компонента передайте пустой массив [].

Скорее у вас тут бардак

setOpNames(props.brand.map((item) => { return {checked: false, name: item, id: item}; }));

6
  • Я там добавил дополнение на эту тему, получаю ворох алярмов в консоли, хотя все вроде как работает. В выражении точно проблем нет, ибо оно то же самое в состоянии прописано и пока я его не использую в эффекте проблем нет.
    – MrYogurt
    25 окт 2020 в 13:37
  • setOpNames(props.brand.map((item) => { return {checked: false, name: item.name, id: item.id}; })); наверно как то так надо 25 окт 2020 в 13:40
  • и если делаете useEffect, то useState надо делать так const [opNames, setOpNames] = useState([]); 25 окт 2020 в 13:41
  • Так у меня по сути так и написано. Переменную только просто так написал, но потом убрал и вынес функцию за эффект. Сейчас все выглядит так: function newData () { setOpNames(props.brand.map((item) => { return {checked: false, name: item, id: item}; })); } useEffect(() => { newData(); }, [props.brand]);
    – MrYogurt
    25 окт 2020 в 13:50
  • item это строка? 25 окт 2020 в 14:01

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

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