Question

我正在尝试将redux包装成这样的react hoc

Post::whereJsonContains('category_id', '3')->get();

如果我要以这种方式编写代码，那么与以性能方式直接连接redux有什么区别？

Answer 1

我不太关注“以性能方式直接连接redux”的问题，但是实际上您有两个HOC，即redux的connect HOC和您的新withUser HOC。 IMO对于两个HOC的任何组成和要装饰的组件，其性能将（应该）相同。

但是建议，将内部组件连接到商店并返回

const withUser = WrappedComponent => {
  class ComponentWithUser extends Component {
    render() {
      return <WrappedComponent {...this.props} />; // props.children included!
    }
  }

  const mapStateToProps = state => ({
    user: state.user,
  });

  return connect(mapStateToProps)(ComponentWithUser);
}

export default withUser;

由于您在内部进行了手动合成，因此省去了compose步骤，因此此处可能会有一些好处/改进，但我怀疑它是否有意义。

追求黄金，减少基于类的组件的开销

const withUser = WrappedComponent => {
  const ComponentWithUser = props => <WrappedComponent {...props} />;

  const mapStateToProps = state => ({
    user: state.user,
  });

  return connect(mapStateToProps)(ComponentWithUser);
}

hoc + redux和redux之间的区别

1 个答案: