React Js ALT - 在另一个成功时调用函数

Question

在下面的 Alt Actions 代码中，如何在 addCharacter 成功后调用 getCharacters()？基本上我在将新记录保存到数据库后尝试刷新字符列表。

getCharacters() {
    requestPromise('http://localhost:3100/api/characters')
      .then((res) => {
        console.log("Getting Characters");
        var opdata = JSON.parse(res);
        this.actions.getCharactersSuccess(opdata.characters);
      }).catch((err) => {
        console.log('error:', err);
        this.actions.getCharactersFail(err)
      })
  }

  addCharacter(data) {
    var options = {
      method: 'POST',
      uri: 'http://localhost:3100/api/characters/add/',
      json: true,
      body: {
        name: data.charName,
        allegiance: data.charAllegiance,
      },
    };
    requestPromise(options)
      .then((res) => {
          // How can I recall getCharacters() from here
      }).catch((err) => {
        console.log('error:', err);
      })
  }

商店

getCharactersSuccess(res) {
    this.setState({
      characters: res
    })
  }

Answer 1

这看起来不对。如果您使用任何架构，例如flux或redux，那就更好了。您可以通过任何方式购买，只需致电return this.getCharacters();。它指的是你的类中的 getCharacters() 函数。您错过的关键点是 return this. 选择正确的引用当您在 Promise 范围内创建 Promise 时会发生错误，但您不会从该 Promise 范围内返回任何内容。所以 return 将解决您的问题。

addCharacter(data) {
    var options = {
      method: 'POST',
      uri: 'http://localhost:3100/api/characters/add/',
      json: true,
      body: {
        name: data.charName,
        allegiance: data.charAllegiance,
      },
    };
    requestPromise(options)
      .then((res) => {
         return this.getCharacters();
      }).catch((err) => {
        console.log('error:', err);
      })
  }

Answer 2

您只需要调用 getCharacters 函数。你可以通过this.getCharacters()来做到这一点

addCharacter(data) {
    var options = {
      method: 'POST',
      uri: 'http://localhost:3100/api/characters/add/',
      json: true,
      body: {
        name: data.charName,
        allegiance: data.charAllegiance,
      },
    };
    requestPromise(options)
      .then((res) => {
         return this.getCharacters();
      }).catch((err) => {
        console.log('error:', err);
      })
  }