useEffect()TypeError：E不是函数 [英] useEffect() TypeError: e is not a function

问题描述

我收到TypeError: e is not a function

在MessagePort.C.port1.onmessage(react.products tion.min.js：24)

由于我在useEffect()中不理解的原因。我意识到这可能是一个相对于我的代码库来说比较模糊的问题，因为我不能在codesandbox中进行复制，但我想无论如何我都会抛出这个问题。

useEffect(() => someVar && console.log('asdf'), [button])

我只需将该函数放入挡路就可以了

useEffect(() => {if (someVar) console.log('asdf')}, [button])

推荐答案

我的第一个假设是，您并不是真的想从useEffect返回，而是错误地使用了简写语法，没有意识到它使用了隐式返回(read here关于箭头函数和隐式返回)。

从useEffect返回的函数将作为清理运行(如注释中所述)。您从效果返回的内容将取决于条件，但在这两种情况下，它都不会返回函数。如果someVar为False，则返回someVar。如果someVar为true，则返回console.log()的值undefined。

请参见下面当useEffect返回false时发生的情况(单击"卸载&q；"按钮查看效果)。

const {useState, useEffect} = React;

const Example = () => {
  const [toggle, setToggle] = useState(true);
   
   return (
    <div>
      {toggle ? <Child /> : null}
      <button onClick={() => setToggle(!toggle)}>unmount</button>
    </div>)
}
const Child = () => {
   useEffect(() => false);
   
   return <span />
}


ReactDOM.render(<Example />, document.getElementById('root'));

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.8.4/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.8.4/umd/react-dom.production.min.js"></script>
<div id="root"></div>

使用效果时应始终使用箭头函数的长手形，除非您只打算将清理传递给它。

这篇关于useEffect()TypeError：E不是函数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！