@n1ksON
1 + 1 == 11 // true

Почему некорректно работает reducer?

Имеется массив из объектов, который разворачивается через map в другой компоненте. Необходима функция, которая, по нажатию на кнопку, добавляла новый объект в массив, тем самым создавая новое текстовое поле. Ошибка в том, что добавляется по 2 объекта за одно нажатие. Почему это работает коряво понять не могу, возможно как-то связано с двойным рендером в React.
Подскажите, что я делаю не так?
Имеется код в App.js:
// let allow = false
const App = () => {
const initialState = { text: [] }
  const reducer = (textarea, action) => {
    switch (action.type) {
      case 'add':
        // allow = !allow
        let arrAdd = textareaValues // в textareaValues хранится тоже самое значение, что и в textarea.text
        /* if (allow) */ arrAdd.push({ id: arrAdd.length, string: '' })
        return { text: arrAdd }
    }
  }
const [textarea, dispatch] = useReducer(reducer, initialState)
return (
<Textarea text={textarea.text} dispatch={dispatch} />
)
}

И код в Textarea.js:
const add = () => {
        props.dispatch({ type: 'add' })
}
return (
<>{props.text.map(data => <textarea value={data.string} onChange={(e) => change(e.target)} id={data.id} />)}
{props.text.length !== 0 ? <button onClick={() => add()}>+</button> : <></>}
</>
)

Добавил только самую, как мне кажется, важную часть кода. Если понадобится, могу выложить в песочницу бОльшую часть проекта.

Самое интересное. Комментариями закрыл ту часть говнокода, с помощью которой получилось пофиксить баг на данный момент, но надеюсь есть адекватное решение))
  • Вопрос задан
  • 36 просмотров
Пригласить эксперта
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы