Question

我有一个技术问题。我试图通过在子组件内部使用动作分派器将值从子组件传递到存储。然后，该动作分派器更新化简器中的状态值。

建议通过这种方式从子组件传递值吗？它会影响React应用的性能吗？

或者我应该使用道具从子组件传递到父组件，然后更新状态。

请提供咨询，因为我对此进行了大量搜索，但未获得任何信息。

Answer 1

将调度程序传递给您的孩子的问题是您的孩子组件不是很可重用。我建议将回调方法传递给您的孩子，其中包含分派事件的逻辑。

父母：

class ParentComponent extends React.Component {

  loginHandler(){
    ...
    this.props.someMethod();
  }

  render() {
    return {
      ...
      <ChildComponent click="loginHandler"></ChildComponent>
      ...
    }
  }
}
const mapDispatchToProps = dispatch => {
  return {
    // dispatching plain actions
    ...
    someMethod: () => dispatch({ ... }),
    ...
  }
}
export default connect(null, mapDispatchToProps)(ParentComponent);

子组件：

function ChildComponent({click}) {
  return {
    ...
    <button click={click}></button>
    ...
  }
}

现在，使用这种方法，您的子级方法将不包含任何业务逻辑。它可以在多个地方使用。

绩效：在React中分派动作与作为道具传递

1 个答案: