Задать вопрос

Как правильно изменить состояние, чтобы приходило предыдущее?

я знаю, что правильно менять состояние предыдущего state, то есть setState( prev => !prev ), но как это прописать для моего случая, когда предыдущее состояние должно поменять на значение item.value ?
возможно поэтому я ловлю баг - на картинке - нажимаю кнопку Д после кнопки М и в indicator сохраняется значение кнопки М, дальше если несколько раз нажать на Д, сохраняется нужное значение

5fc7819bad089148717394.jpeg

export const ControlIndicators = ({ position }) => {
  const [indicator, setIndicator] = useState('month');
  
  const clickHandler = value => {
    setIndicator(value);
    console.log('indicator: ', indicator);
  };

  const buttons = [
    { title: 'Дневной показатель', value: 'day' },
    { title: 'Месячный показатель', value: 'month' },
  ];

  return (
    <Control position={position} className="leaflet-bar leaflet-bar-row">
      {buttons.map(item => {
        return (
          <button
            className={
              indicator === item.value ? 'buttons-leaflet-item active' : 'buttons-leaflet-item'
            }
            title={item.title}
            value={item.value}
            onClick={() => clickHandler(item.value)}
          >
            {item.value === 'day' ? 'Д' : 'М'}
          </button>
        );
      })}
    </Control>
  );
};
  • Вопрос задан
  • 96 просмотров
Подписаться 1 Простой Комментировать
Решения вопроса 1
0xD34F
@0xD34F Куратор тега React
я знаю, что правильно менять состояние предыдущего state, то есть setState( prev => !prev ), но как это прописать для моего случая, когда предыдущее состояние должно поменять на значение item.value ?

Если новое состояние не зависит от старого, то и не надо старое состояние трогать: setState(() => value).

нажимаю кнопку Д после кнопки М и в indicator сохраняется значение кнопки М

Чушь. Откуда вы это взяли? Сохраняемое значение у вас лежит в value, не надо смотреть на indicator в момент вызова setIndicator. Делайте это через эффект:

useEffect(() => console.log('indicator: ', indicator), [ indicator ]);
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы