反应无状态组件是否等于ReacDOM.PureComponents

Question

根据文件（https://reactjs.org/docs/react-api.html#react.purecomponent）

  

＆＃34; React.PureComponent与React.Component完全相同但实现   shouldComponentUpdate（）具有浅的prop和状态比较。＆＃34;

因此，如果我定义类似下面的内容，

const MyView = () => {
  return (
    <div>Hello Stateless Component</div>
  )
};

是React.PureComponent吗？它是否做浅浅的道具和状态比较？

Answer 1

它们完全不相同。

无状态组件或官方名称React Stateless Functional Component(RSFC)没有“州”。

React组件接收用于从外部传递参数的道具，并使用state对象作为inside state control object，我们调用setState函数来修改state对象以触发组件的重新呈现， RSFC只接收道具并返回相应的JSX元素，它没有“内部状态”对象。

PureComponent是React.PureComopnent，它不是一类组件的通用术语，它是可以扩展的React.PureComponent类，我们使用

class MyComponent extends React.PureComponent{}

告诉我MyComponent 是纯粹的组件。

如果您想要<Clock/>组件展示和更新时间本身，您应该使用PureComponent并且无法控制RSFC

中的时间更新

有关differences between Component and PureComponent this article的更多信息可能是帮助。

Answer 2

首先，您编写的组件是功能组件，它不是纯组件。

Pure Component意味着您知道如果组件获得相同的props和状态，则不需要重新呈现自身或其子组件，因此它从shouldComponentUpdate方法返回false，以便不执行componentWillUpdate，render和componentDidUpdate。