我一直在使用react.js创建一个小应用程序.我过分考虑了“表现”.
所以我有一个名为“Spinner”的简单子组件.我的目标是确保此组件永远不会重新呈现.
这是我的组件:
import React,{PureComponent} from 'react'; export default class Spinner extends PureComponent { render() { return ( <div className="spinner"> <div className="bounce1"></div> <div className="bounce2"></div> <div className="bounce3"></div> </div> ) } }
在使用’react-addons-perf’重新渲染时,组件总是渲染,我使用的是PureComponent,因为我希望该组件只渲染一次,我读到我可以使用不可变的道具,但我不知道我知道如何使这成为可能.
如果我做一些喜欢这个:
componentDidMount() { this.renderState = false; } shouldComponentUpdate(nextProps,nextState) { return (this.renderState === undefined) ? true : this.renderState; }
它只呈现一次,但我相信有更好的方法.
如何避免重新渲染?或者我怎么能制作不变的道具?
解决方法
您不需要为componentShouldUpdate提供额外的逻辑,因为您不希望您的组件永远重新渲染.
仅添加此项应足以防止组件重新呈现:
shouldComponentUpdate(nextProps,nextState) { return false }
原文地址:https://www.jb51.cc/js/151053.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。