Question

我知道使用尽可能多的无状态函数是一个很好的做法，但我遇到了父容器组件呈现的问题，这当然会导致其子级的级联重新呈现。无状态函数（据我所知）无法选择不渲染。

如何在渲染时优化我的应用程序，并仍然使用无状态函数？

Answer 1

使用更高阶的功能：

function once(fn) {
  let called = false;
  let result = null;
  return function() {
    if(!called) {
      called = true;
      result = fn.apply(null, arguments);
    }
    return result;
  };
}

const DumbComponent = once(() => {
  console.log("Rendering dumb component"); // will only ever happen once
  return (<div>I am a component</div>);
});

CodePen

如何防止不必要的重新呈现无状态函数？

1 个答案: