zoukankan      html  css  js  c++  java
  • [React] PureComponent in React

    In this lesson, you will learn how to use PureComponent in React to reduce the number of times your component re-renders.

    This works because PureComponent implements a shallow comparison for us by default in shouldComponentUpdate() , saving us time and reducing the complexity of our components. Its important to note that the comparison is shallow, meaning that if you are updating an object with nested values the component will not re-render as React has not noticed a change.

    The same, if you pass a prop as a function reference, it will not cause re-render, but is you pass a anonymous arrow function which means it will create a new function every time, then it will cuase re-render.

     handleChange = e => {
        const { name, value } = e.target;
        this.setState({ [name]: value });
      };
    
    // pass a function
    <Counter onChange={this.handleChange} />
    
    // vs pass a arrow function
    <Counter onChange={() => console.log('this will cause re-render')} />

  • 相关阅读:
    C# 中的var关键字
    sql中去掉换行符和回车符
    Linq之旅:Linq入门详解(Linq to Objects)
    c# for 和 foreach
    c# Dictionary
    ASP.NET Web.config学习
    c# 装箱与拆箱的概念
    c# List集合学习
    Index was out of range
    C# double保留四位小数
  • 原文地址:https://www.cnblogs.com/Answer1215/p/9721700.html
Copyright © 2011-2022 走看看