Question

我在支柱上遇到流量错误，当我在它之前调用this.setState()时，我知道这是一个字符串。如果我在使用道具的行之后移动setState()调用，则错误消失。我得到的错误是：

空

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

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

两个错误都出现在同一行代码中。

这是组件的精简版本。请参阅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中的一个错误，还是我错过了什么？

Answer 1

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

将endpoint拉出到自己的变量中，你应该好好去。

调用`this.setState（）`会破坏componentWillReceiveProps

1 个答案: