组件优化性能

技术组件优化性能 组件优化性能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)

相关推荐

  • HBase如何使用HashTable/SyncTable工具同步集群数据

    技术HBase如何使用HashTable/SyncTable工具同步集群数据这篇文章主要为大家展示了“HBase如何使用HashTable/SyncTable工具同步集群数据”,内容简而易懂,条理清晰,希望能够帮助大家解

    攻略 2021年12月8日
  • CSS代码重构与优化的方法有哪些

    技术CSS代码重构与优化的方法有哪些本篇内容主要讲解“CSS代码重构与优化的方法有哪些”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“CSS代码重构与优化的方法有哪些”吧!CS

    攻略 2021年12月10日
  • 怎么练腰,在健身房如何练腰上的力量

    技术怎么练腰,在健身房如何练腰上的力量腰部练习方法怎么练腰:1.直腿硬拉初始姿式:双脚开立,与肩同宽或稍窄,直腿体前屈,两手握住地面上的杠铃杆,握距稍宽于肩。动作近程:双手紧握杠铃,腰背用力将其直臂拉起,至上体完全挺直,

    生活 2021年10月23日
  • 怎么解决Maven版本不一致问题

    技术怎么解决Maven版本不一致问题这篇文章主要介绍“怎么解决Maven版本不一致问题”,在日常操作中,相信很多人在怎么解决Maven版本不一致问题问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家

    攻略 2021年11月16日
  • Python中异常处理用法有哪些

    技术Python中异常处理用法有哪些本篇内容主要讲解“Python中异常处理用法有哪些”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“Python中异常处理用法有哪些”吧!为了

    攻略 2021年11月30日
  • 鳄鱼属于哺乳动物吗,为什么说鳄是最高等的爬行动物

    技术鳄鱼属于哺乳动物吗,为什么说鳄是最高等的爬行动物提起鳄鱼,大家就会想到它是很凶猛的动物鳄鱼属于哺乳动物吗。生活在热带地区的非洲鳄,长达5米,重约1吨。它们有时会突然咬住到河边饮水的牛、羚羊、鹿,用力地把它们拖入水中,

    生活 2021年10月23日