React组件，如何解决destory is not a function的问题？

我们相信：世界是美好的，你是我也是。平行空间的世界里面，不同版本的生活也在继续...

调试React程序的时候，组件正常加载完毕。然后准备触发再次加载组件的时候，就忽然报错了。显示错误提示信息是：destory is not a function。这个问题该如何解决呢？destory这个关键词，初步分析指向的是组件卸载的过程啊...

苏南大叔的“程序如此灵动”博客，记录苏南大叔的代码编程经验总结。本文测试环境：nodejs@20.18.0，create-react-app@5.0.1，react-router-dom@6.27.0，react@18.3.1。

错误截图

错误截图如下：

可能的错误代码

相关代码如下：

useEffect(() => count.current++);

修改成：

useEffect(() => count.current++,[]);

问题貌似解决。

新的错误提示

打开开发者模式的话，在上一个组件正常显示之后，console里面就有错误提示了。

react-dom.development.js:84 Warning: useEffect must not return anything besides a function, which is used for clean-up.

继续修改：

useEffect(() => {
  count.current++;
},[]);

恢复原始形态，解决问题。

仔细想一下的话，这两个代码，表面上看效果是一样的。不过，直接箭头函数，不带花括号这种写法，隐藏着一个return关键字。最终导致了错误提示信息的发生。

所以说啊，这个函数简写，不能瞎写。必要的表达式还是需要的。

相关文章

这里的代码，如果大家不明白这个useEffect()钩子的话，可以参考下面的这个链接：

• https://newsn.net/say/react-useeffect.html
• https://newsn.net/say/js-double-arrow-function.html

结语

更多苏南大叔的react经验文章，请点击苏南大叔的相关经验文章：

• https://newsn.net/tag/react/

如果本文对您有帮助，或者节约了您的时间，欢迎打赏瓶饮料，建立下友谊关系。
本博客不欢迎：各种镜像采集行为。请尊重原创文章内容，转载请保留作者链接。