小编典典

在render()中反应函数

reactjs

是否有将功能放置在react组件中的偏好?我仍在学习反应,因此只想找出最佳做法。

class Content extends React.Component {
    /// Whats the difference between putting functions here such as 
   Hello(){

   }

  render(){
      /// or here
   Hello(){

   }


    return()(
      <div>blah blah </div>

    )

    }


  }

阅读 270

收藏
2020-07-22

共1个答案

小编典典

每次渲染都会在render方法中创建一个函数,这会对性能造成轻微的影响。如果将它们放入渲染中也很麻烦,这是一个更大的原因,您不必滚动渲染中的代码即可查看html输出。始终将它们放在课堂上。

对于无状态组件,最好将函数保留在main函数之外,而传递props,否则该函数也会在每个渲染器中创建。我还没有测试性能,所以我不知道这是否是微优化,但值得注意。

例:

const MyStatelessComponent = ({randomProp}) => (
    render() {
        doSomething(randomProp);

        return <div />
    }
);

doSomething = (randomProp) => {
    //Do something here
}
2020-07-22