react扩展3

北京治扁平疣好医院 http://m.39.net/pf/a_8812967.html
组件优化Componnt的个问题只要执行stStat(),即使不改变状态数据,组件也会重新rndr()==效率低只当前组件重新rndr(),就会自动重新rndr子组件，纵使子组件没有用到父组件的任何数据==效率低效率高的做法只有当组件的stat或props数据发生改变时才重新rndr()原因Componnt中的shouldComponntUpdat()总是返回tru解决

办法1:

重写shouldComponntUpdat()方法

比较新旧stat或props数据,如果有变化才返回tru,如果没有返回fals

办法:

使用PurComponnt

PurComponnt重写了shouldComponntUpdat(),只有stat或props数据有变化才返回tru

注意:

只是进行stat和props数据的浅比较,如果只是数据对象内部数据变了,返回fals

不要直接修改stat数据,而是要产生新数据

项目中一般使用PurComponnt来优化

rndrprops

如何向组件内部动态传入带内容的结构(标签)?

Vu中:

使用slot技术,也就是通过组件标签体传入结构AB//A

Ract中:

使用childrnprops:通过组件标签体传入结构

使用rndrprops:通过组件标签属性传入结构,而且可以携带数据，一般用rndr函数属性

childrnprops

ABxxxx/B/A

{this.props.childrn}

问题:如果B组件需要A组件内的数据,==做不到

rndrprops

Arndr={(data)=Cdata={data}/C}/A

A组件:{this.props.rndr(内部stat数据)}

C组件:读取A组件传入的数据显示{this.props.data}

注意：

如果在rndr方法里创建函数，那么使用rndrprop会抵消使用Ract.PurComponnt带来的优势。因为浅比较props的时候总会得到fals，并且在这种情况下每一个rndr对于rndrprop将会生成一个新的值。

错误边界理解：

错误边界(Errorboundary)：用来捕获后代组件错误，渲染出备用页面

特点：

只能捕获后代组件生命周期产生的错误，不能捕获自己组件产生的错误和其他组件在合成事件、定时器中产生的错误

使用方式：

gtDrivdStatFromError配合

转载请注明：http://www.aierlanlan.com/rzgz/171.html