我是新手反应重新选择,问题是当我Perf.printWasted时,它总是显示“内容单一>连接(单项目索引)”只有1个实例而不是渲染xx次
这是我当前的代码
import React, { Component } from 'react';
import { connect } from 'react-redux';
import { createSelector } from 'reselect';
import { shape } from 'prop-types';
import Entry from '/components/entries/Entry';
class Entries extends Component {
static displayName = 'Single Entries Index';
static propTypes = { entries: shape() };
shouldComponentUpdate(nextProps) {
if (this.props.entries.size !== nextProps.entries.size) {
return true;
}
return false;
}
render() {
const { entries } = this.props;
return (
<ul className="entries">
{entries.map(entry => (
<Entry
key={entry.get('id')}
id={entry.get('id')}
/>
))}
</ul>
);
}
};
const makeGetEntries = createSelector(
state => state.data,
data => data.get('entries')
);
const mapStateToProps = (state) => {
return {
entries: makeGetEntries(state)
};
};
export default connect(mapStateToProps)(Entries);
按照@Logar
的建议使用createSelectorCreator工作解决方案const createDeepEqualSelector = createSelectorCreator(
defaultMemoize,
isEqual
);
const makeGetEntries = createDeepEqualSelector(
state => state.data,
data => data.get('entries')
);
const mapStateToProps = (state) => {
return { entries: makeGetEntries(state) };
};
export default connect(mapStateToProps)(Entries);