Question

所以我做了一个项目，在那里我基本上编写了自己的Redux版本，并且我试图做一些非常复杂的打字，而且我不确定Flow是否有能力处理它。也许我做错了什么，但如果我能让它发挥作用，那将是非常优雅的。

这是我的connect功能

// @flow
// TODO: think about how to make this more efficient, since forceUpdate on every subscribe will get inefficient

import React, { PureComponent } from 'react';

import type { Store } from './getStore';

function connectToStore<StateType, MappedProps: Object, PassedProps: Object>(
  store: Store<StateType>, 
  mapStateToProps: (StateType) => MappedProps, 
  OldComponent: (PassedProps & MappedProps) => React$Element<*>
) {
  return class Connected extends PureComponent<PassedProps, { storeState: StateType }> {
    unsubscribe: () => void;

    constructor(props: PassedProps, context: any) {
      super(props, context);
      this.state = {
        storeState: store.getState()
      };
      this.unsubscribe = store.subscribe((state) => this.setState({ storeState: state }));
    }

    componentWillUnmount() {
      this.unsubscribe();
    }

    render() {
      const mappedProps = mapStateToProps(this.state.storeState);
      return React.createElement(OldComponent, { ...this.props, ...mappedProps });
    }
  };
}

export default connectToStore;

所以应该发生的是，这个组件的输入应该使它如果我在组件C上调用这个函数，那么它将评估C的道具并检查以确保传递到组件中的道具与mapStateToProps中的道具满足C的每个道具要求。

然而，所发生的事情基本上都没有类型检查。我不必填写C的任何道具要求（既不在mapToProps函数中，也不在从直接父项传入的道具中），并且流程无论如何都接受它。这是否超出流量的能力？或者我错过了什么？

Answer 1

你只是想使用像Angular这样的好框架

如何在流中键入检查类似Redux的connect（）函数

1 个答案: