Next.js开发中页面回退时报Unhandled Runtime Error:TypeError: destroy is not a function
问题描述
在Next.js开发中,从A页面跳转到B页面,再使用浏览器回退到A页面时报上述错误:
错误原因
是因为在B页面里,在使用useEffect
时,错误地定义了异步函数:
useEffect( async () => {
const quizs = await getTheoreticalQuiz()
setQuizs(quizs)
}, []);
控制台会抛出错误,并给出推荐的写法:
app-index.tsx:25 Warning: useEffect must not return anything besides a function, which is used for clean-up.
It looks like you wrote useEffect(async () => …) or returned a Promise. Instead, write the async function inside your effect and call it immediately:
useEffect(() => {
async function fetchData() {
// You can await here
const response = await MyAPI.getData(someId);
// ...
}
fetchData();
}, [someId]); // Or [] if effect doesn't need props or state
解决办法
按照推荐的写法修改即可:
useEffect( async () => {
async function fetchData(){
const quizs = await getTheoreticalQuiz()
setQuizs(quizs)
}
fetchData()
}, []);