{"componentChunkName":"component---src-templates-docs-js","path":"/docs/shallow-compare.html","result":{"data":{"markdownRemark":{"html":"
\n

Примечание:

\n

shallowCompare устарел. Используйте вместо этого React.memo или React.PureComponent.

\n
\n

Импортирование

\n
import shallowCompare from 'react-addons-shallow-compare'; // ES6\nvar shallowCompare = require('react-addons-shallow-compare'); // ES5 with npm
\n

Обзор

\n

Перед появлением React.PureComponent shallowCompare использовался для того же, что и PureRenderMixin при использовании ES6-классов с React.

\n

Если функция рендера React-компонента является «чистой» (возвращается тот же результат при таких же пропсах и состоянии), вы можете в некоторых случаях использовать эту функцию для повышения производительности.

\n

Пример:

\n
export class SampleComponent extends React.Component {\n  shouldComponentUpdate(nextProps, nextState) {\n    return shallowCompare(this, nextProps, nextState);\n  }\n\n  render() {\n    return <div className={this.props.className}>foo</div>;\n  }\n}
\n

shallowCompare поверхностно сравнивает объекты текущих props и state с будущими nextProps и nextState.\nПри переборе ключей сравниваемых объектов возвращается true, если значения ключа в каждом объекте имеют нестрогое равенство.

\n

shallowCompare возвращает true, если поверхностное сравнение пропсов или состояния находит разницу. В таком случае компонент обновится.\nshallowCompare возвращает false, если поверхностное сравнении пропсов и состояния не находит разницу. Компонент не нуждается в обновлении.

","frontmatter":{"title":"Поверхностное сравнение","next":null,"prev":null},"fields":{"path":"content/docs/addons-shallow-compare.md","slug":"docs/shallow-compare.html"}}},"pageContext":{"slug":"docs/shallow-compare.html"}},"staticQueryHashes":[]}