组件优化性能

技术组件优化性能 组件优化性能import React from "react";
class Home extends React.Component {constructor(props) {sup

组件优化性能

从“反应”导入做出反应;

类主页扩展了做出反应.组件{

构造器(道具){ 0

超级(道具);

this.state={

66岁

}

}

render(){ 0

控制台。日志('主页被渲染了');

返回(

差异

pHome/p

p{this.state.age}/p

/div

)

}

}

类应用扩展了做出反应.组件{

构造器(道具){ 0

超级(道具);

this.state={

名为: '谢本音'

}

}

render(){ 0

控制台。日志(' App组件被渲染了');

返回(

差异

h1App/h1

p{this.state.name}/p

按钮OnClick={()=this。Btn click()} Btn/按钮

主页/

/div

)

}

BTN点击(){ 0

这个。setstate({ 0

名称: 'xby '

})

}

}

导出默认应用

修改应用组件中的这个。州,家子组件也会被重新渲染

类组件优化性能

从“反应”导入做出反应;

类主页扩展了做出反应.PureComponent { //自己的这个州没有发生改变就不会重新渲染

构造器(道具){ 0

超级(道具);

this.state={

66岁

}

}

render(){ 0

控制台。日志('主页被渲染了');

返回(

差异

pHome/p

p{this.state.age}/p

/div

)

}

}

类应用扩展了做出反应.组件{

构造器(道具){ 0

超级(道具);

this.state={

名为: '谢本音'

}

}

render(){ 0

控制台。日志(' App组件被渲染了');

返回(

差异

h1App/h1

p{this.state.name}/p

按钮OnClick={()=this。Btn click()} Btn/按钮

主页/

/div

)

}

BTN点击(){ 0

这个。setstate({ 0

名称: 'xby '

})

}

}

导出默认应用

使用做出反应PureComponent .创建出来的组件,会自动进行优化,父组件的这个州发生改变不会重新渲染子组件

函数式组件

从“反应”导入做出反应;

const MemoHome=react。memo(函数(){//返回一个优化后的组件

控制台。日志('主页被渲染了');

返回(

divHome/div

)

})

类应用扩展了做出反应.组件{

构造器(道具){ 0

超级(道具);

this.state={

名为: '谢本音'

}

}

render(){ 0

返回(

差异

h1App/h1

p{this.state.name}/p

按钮OnClick={()=this。Btn click()} Btn/按钮

MemoHome /

/div

)

}

BTN点击(){ 0

这个。setstate({ 0

名称: 'xby '

})

}

}

导出默认应用

使用做出反应。备忘录优化函数式组件,父组件自身的这个州发生改变,子组件不会重新渲染

内容来源网络,如有侵权,联系删除,本文地址:https://www.230890.com/zhan/149519.html

(1)

相关推荐

  • 火柴英文,小学英语课外教材哪个好

    技术火柴英文,小学英语课外教材哪个好英语课外教材问题,作为资深老师,我想我能提供一些有建设性的建议火柴英文:首先,有考级要求比如剑桥五级考试的学生。小学孩子很多考KET和PET,这些我建议的教材如下:应试的话剑桥的Unl

    2021年10月26日
  • Python脚本程序与Perl怎么进行比较

    技术Python脚本程序与Perl怎么进行比较Python脚本程序与Perl怎么进行比较,相信很多没有经验的人对此束手无策,为此本文总结了问题出现的原因和解决方法,通过这篇文章希望你能解决这个问题。Python脚本程序在

    攻略 2021年10月28日
  • 四字成语的意思,100个四字成语带解释

    技术四字成语的意思,100个四字成语带解释1.洞若观火四字成语的意思:形容看得清楚明白。
    2.
    对簿公堂:在公堂受审。
    3.
    耳濡目染:形容见得多听得多之后,无形之中受到影响。
    4.
    耳熟能详:听得次数多了,熟悉得能详尽

    生活 2021年10月22日
  • Ajax中外部数据格式有哪些

    技术Ajax中外部数据格式有哪些小编给大家分享一下Ajax中外部数据格式有哪些,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!HTML优点:HT

    攻略 2021年11月18日
  • Python爬取世纪佳缘的数据是否能证明它不靠谱的示例分析

    技术Python爬取世纪佳缘的数据是否能证明它不靠谱的示例分析这期内容当中小编将会给大家带来有关Python爬取世纪佳缘的数据是否能证明它不靠谱的示例分析,文章内容丰富且以专业的角度为大家分析和叙述,阅读完这篇文章希望大

    攻略 2021年10月26日
  • Java字符串比较方法有哪些

    技术Java字符串比较方法有哪些本篇内容介绍了“Java字符串比较方法有哪些”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成

    攻略 2021年11月4日