时间戳

首页 > 解决方案 > React Rerender 组件不起作用，无法读取未定义的属性“forceUpdate”

reactjs - React Rerender 组件不起作用，无法读取未定义的属性“forceUpdate”

问题描述

如何让 forceUpdate() 重新渲染组件？我收到以下错误，无法读取未定义的属性“forceUpdate”

function App() {

  const renderData = () => {
    console.log('render');
    this.forceUpdate();
  }

  return (
    <div>
      Test
      <button onClick={renderData}> render data </button>
    </div>
  );
}

错误：

TypeError：无法读取未定义的属性“forceUpdate”

const renderData = () => {
console.log('render');
this.forceUpdate();

资源：你能在不调用 setState 的情况下强制 React 组件重新渲染吗？

标签： reactjs

解决方案

this.forceUpdate()仅在基于类的组件中可用

您可以通过更新状态来强制更新：

const [someVar, setSomeVar] = useState(null);

const renderData = () => {
    console.log('render');
    setSomeVar(true);
}

或者从这里获得灵感，创建自己的 forceUpdate 函数：

function useForceUpdate(){
    const [value, setValue] = useState(0); // integer state
    return () => setValue(value => value + 1); // update the state to force render
}

我强烈建议不要这样做，这表明您可能应该以不同的方式构建您的逻辑。

推荐阅读