调用 `this.setState()` 会中断对 componentWillReceiveProps 中 prop 的流类型检查

当我调用时，我在知道是字符串的 prop 上遇到流错误this.setState()就在它之前。如果我移动setState()在使用 prop 的行之后调用，错误就会消失。我收到的错误是：

null

此类型与预期的字符串参数类型不兼容

不明确的

此类型与预期的字符串参数类型不兼容

这两个错误都发生在同一行代码上。

这是该组件的精简版本。参见实施componentWillReceiveProps:

import React, { Component } from "react";
import apiRequest from "../../services/apiRequest";

type PropsT = {
  endpoint: ?string,
};

export default class ApiLoader extends Component {
  props: PropsT

  static defaultProps = { endpoint: null }
  state = { isFetching: true }

  componentWillReceiveProps(nextProps: PropsT) {
    if (!nextProps.endpoint) return;

    this.setState({ isFetching: true });
    this.fetch(nextProps.endpoint);       // FLOW ERROR HERE
  }

  fetch(endpoint: string) {
    apiRequest.get(endpoint)
      .then(() => this.setState({ isFetching: false }));
  }

  render(): React.Element<*> {
    return <div>Whatever.</div>;
  }
}

只需切换最后两行的顺序即可componentWillReceiveProps修复它：

this.fetch(nextProps.endpoint);      // NO ERROR!
this.setState({ isFetching: true });

这只是 Flow 中的一个错误，还是我遗漏了什么？

这是由于类型细化失效造成的：https://flow.org/en/docs/lang/refinements/#toc-refinement-invalidations https://flow.org/en/docs/lang/refinements/#toc-refinement-invalidations

拔出endpoint进入它自己的变量，你应该可以开始了。