javascript - マウントされていないコンポーネントで setState (または forceUpdate) を呼び出すことはできません

Question

コンポーネントが更新された後にサーバーからデータを取得しようとしていますが、それを行うことができませんでした。私が理解している限りcomponentWillUnmount、コンポーネントが破棄されようとしているときに呼び出されますが、破棄する必要はないので、私には役に立ちません。これに対する解決策は何ですか？いつ状態を設定する必要がありますか?

async componentDidUpdate(prevProps, prevState) {
  if (this.props.subject.length && prevProps.subject !== this.props.subject) {
    let result = await this.getGrades({
      student: this.props.id,
      subject: this.props.subject
    });
    this.setState({
      subject: this.props.subject,
      grades: result
    });
  }
}

async getGrades(params) {
  let response, body;

  if (params['subject'].length) {
    response = await fetch(apiRequestString.gradesBySubject(params));
    body = await response.json();
  } else {
    response = await fetch(apiRequestString.grades(params));
    body = await response.json();
  }

  if (response.status !== 200) throw Error(body.message);

  return body;
}

完全なエラー:

Warning: Can't call setState (or forceUpdate) on an unmounted component. This is a no-op, 
but it indicates a memory leak in your application. To fix, cancel all subscriptions and
asynchronous tasks in the componentWillUnmount method.