#javascript #reactjs #react-router #react-router-dom #react-router-v4
Вопрос:
У меня есть шаблон кода, который, как я знаю, не сработает, но я не могу его объяснить.
const MyComponent=()=>{
const history = useHistory();
function sleep(ms) {
return new Promise(resolve => setTimeout(resolve, ms));
}
async function onClickHandler(){
await sleep(2000)
history.push("/newRoute");
}
return (
<button onClick={onClickHandler}>Click Me!!</button>
)
}
Для кода выше, когда вы нажимаете кнопку, функция должна подождать 2 секунды, а затем перейти на новый маршрут.
Этого не происходит. при нажатии на кнопку ничего не происходит. Я не уверен, что понимаю причину этого. В идеале ожидание должно разрешиться через 2 секунды, и должна быть вызвана история.push. Почему его не вызывают?
Комментарии:
1. ты пробовал
console.log
вместоhistory.push
этого ? Просто чтобы доказать, что он не сломан по другим причинам?2. Пожалуйста, добавьте это: импорт { История использования } из ‘react-router-dom’;
3. Я не заметил никакой ошибки в данном коде. Итак, я примерил его codesandbox.io и он выполняется без каких-либо проблем. Возможно, вы сделали что-то не так при определении случая переключения для маршрутов. Пожалуйста, поделитесь всем своим кодом. URL-адрес Codesandbox
4. Да, я понимаю. Может быть, это ошибка в другом файле. Дай мне взглянуть. Спасибо @priyansh-гахарана
Ответ №1:
ОБНОВЛЕНИЕ: OP здесь: Приведенный выше вопрос не содержит никаких ошибок. В другом файле была ошибка. Пожалуйста, следуйте ответу @priyansh-gaharana в комментарии для URL-адреса codesandbox