【问题标题】:Multiple component file connect to redux多个组件文件连接到redux
【发布时间】:2021-09-08 19:34:02
【问题描述】:

如何使用 connect() 函数将具有多个组件的文件连接到 redux?

我在导出的底部组件中连接了其他组件。可以连接。

我已经像这样连接了其他的,但是在有多个的文件中我不能像那样导出。

const PageKierowcyTableView = (props) =>{
return (
    <JSX>
  )
};
export connect(mapStateToProps,actions)(PageKierowcyTableView )

export const PageKierowcyTableView = (props) =>{
return (
    <JSX>
  )
};


export const PageRozliczeniaNaMoimAucieTable = (props) => {
  return (
    <JSX>
  );
};

export const PageRozliczeniaNaSwoimAucieTable = (props) => {
    return (
      <JSX>
    );
  };
};

【问题讨论】:

    标签: reactjs redux react-redux react-hooks


    【解决方案1】:

    您可以使用命名导出而不是默认导出。例如

    const PageKierowcyTableView = (props) => ...;
    
    const PageRozliczeniaNaMoimAucieTable = (props) => ...;
    
    const PageRozliczeniaNaSwoimAucieTable = (props) => ...;
    
    export const ConnectedPageKierowcyTableView = connect(mapStateToProps,actions)(PageKierowcyTableView)
    
    export const ConnectedPageRozliczeniaNaMoimAucieTable = connect(mapStateToProps,actions)(PageRozliczeniaNaMoimAucieTable)
    
    export const ConnectedPageRozliczeniaNaSwoimAucieTable = connect(mapStateToProps,actions)(PageRozliczeniaNaSwoimAucieTable)
    
    

    根据您的组件,您可能还有不同的mapStateToProps 实现。

    【讨论】:

    • 感谢您的回答。我明白,但我寻找具有相同组件名称的解决方案。我 dont wanna repeat myself. Ive 已经从父组件传递了道具,但感谢您的解决方案。
    • 如果它们都使用相同的 mapStateToProps 和操作,那么您可以将其保存到变量中,例如 const withProps = connect( mapStateToProps, actions )。然后在所有组件上使用相同的 HOC。导出 const ConnectedPageKierowcyTableView = withProps(PageKierowcyTableView)。您还可以内联定义内部组件。 export const PageKierowcyTableView = withProps( props => ... )
    • 我不考虑。我会用它。谢谢:)
    猜你喜欢
    • 2020-11-01
    • 2020-05-05
    • 2020-10-20
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-11-21
    • 2017-12-17
    • 1970-01-01
    相关资源
    最近更新 更多