Question

我正在尝试将props从父组件传递到包装在容器中的子组件。我想使用选择器来使用向下传递的字符串作为道具，以便它可以选择父数据的子状态。

现在数据的结构如下：

Industry: {
 Data: {
  coolants: [array],
  machines: [array],
  tools: [array]
 }
}

使用选择器我可以选择所有行业数据，但是我试图使用选择器仅选择“冷却剂”

在我的父级组件中，我传递了用于选择“冷却剂”的道具： <ChartContainer category='coolants' />

ChartContainer.js：

const mapStateToProps = createStructuredSelector({
    data: makeSelectData(),
})

const withConnect = connect(mapStateToProps, null)
const withReducer = injectReducer({ key: 'industry', reducer })

export default compose (
    withReducer,
    withConnect
)(ChartComponent);

selectors.js

const selectDomain = () => state => state.get('industry')

const makeSelectData = () => createSelector(
  selectDomain(),
  substate => substate.toJS()
)

export {
  makeSelectData
}

Answer 1

您需要两件事：

在选择器（mapStateToProps docs: ownProps）中使用组件道具的类别值；
使用此道具会在您不变的数据结构（ImmutableJS docs: getIn）中嵌套值；

可能的更改是：

const selectDomain = () => (state, props) => state.getIn(['industry', props.category])

如何使用重新选择将道具传递到包装在容器中的子组件？

1 个答案: