Блог

Главная - Вопросы по программированию - Обработчик onBlur() вызывается дважды и вызывает странную ошибку

Обработчик onBlur() вызывается дважды и вызывает странную ошибку

#javascript #html #reactjs #react-redux #antd

Вопрос:

Я новичок в использовании react и redux, проблема возникла, когда я использовал событие размытия, подобное этому:

                <Input
                    ......
                    onBlur={updateSubtask}
                />

updateSubtask=(e)=>{
        console.log(e);
        debugger;
        dispatch(updateSubtask({
            idx:e.target.id,
            uuid:details.uuid,
            name:e.target.defaultValue
        }))
}

если бы я отредактировал содержимое элемента ввода, а затем щелкнул другое пустое место, событие onblur сработало бы дважды, и в первый раз терминал утешил это:
SyntheticBaseEvent {...} , объект события. но во второй раз: e:{idx: '0', uuid: '123456', name: 'study123'}
странный объект, который в точности является полезной нагрузкой redux actions…it это не имеет смысла.

теперь я действительно сбит с толку, почему onblur всегда срабатывает дважды и почему объект события будет указывать на объект redux actions?

Комментарии:

1. возможно, проблема в синтетическом базовом событии react …

2. как вы понимаете, что обработчик событий запускается дважды? вы консольно регистрируете что-либо в updateSubtask

3. ну, вы вызываете updateSubtask свой updateSubtask обработчик событий внутри dispatch вызова. Я предполагаю, что это должно быть создателем действия redux, но вам нужно переименовать его или переименовать функцию обработчика размытия! Хороший линтер должен сказать вам, скрываете ли вы имя импортированной функции, подобной этой, кстати.

4. но теперь я должен выяснить, почему событие срабатывает дважды, чтобы решить проблему

5. он срабатывает дважды, потому что вы вызываете его внутри себя (событие размытия iself НЕ срабатывает дважды, но один пожар вызывает бесконечное количество вызовов вашей функции.) . Как я уже сказал, это похоже на проблему с именованием — у вас есть обработчик размытия и создатель действия redux, оба вызываются updateSubtask . Переименуйте один из них, и у вас не будет этой проблемы.

Метки: