Visual Studio React + Redux 模板中单个组件的多个状态

Question

我正在使用 Visual Studio 2017 React + Redux 模板并遇到了问题。到目前为止，我已经按照他们的模式成功设置了商店，但现在我需要让组件访问多个状态。我的状态对象是这样设置的：

type AssociateCardToMemberProps =
    AssociateCardToMemberStore.IAssociateCardToMemberState
    & LookupMemberStore.ILookupMemberState
    & LookupCardStore.IGetCardInfoState
    & typeof AssociateCardToMemberStore.actionCreators;

然后像这样运行连接：

export default connect(
    (state: IApplicationState) => ({
        associateCardToMember: state.associateCardToMember,
        lookupMember: state.lookupMember,
        getCardInfo: state.getCardInfo
     }),
    AssociateCardToMemberStore.actionCreators
)(AssociateCardToMember);

这给了我错误：

[at-loader] 中的错误 ./ClientApp/components/AssociateCardToMember.tsx:46:3 TS2345：“typeof AssociateCardToMember”类型的参数不可分配给“Component

Answer 1

我通过这个问题找到了一个优雅的解决方案：Multiple Redux states in a single component - Typescript, React, Redux

只需将属性定义更改为 ...

export default connect(
    (state: IApplicationState) => ({
        ...state.associateCardToMember,
        ...state.lookupMember,
        ...state.getCardInfo
    }),
    AssociateCardToMemberStore.actionCreators
)(AssociateCardToMember);