Question

假设我已经安装了一个名为something的第三方反应组件库，该库调用通过async onRequestName给它的prop函数。

something将使用异步函数中解析的数据来呈现结果。

<Something onRequestName={this.asyncFunction}/>

我的async函数需要用户输入，而我只想在用户提供输入时解决它（否则我应该拒绝承诺）。< / p>

asyncFunction = async () => {
  // get user input and then resolve this funciton
}

在这种情况下我应该如何进行？

我发现讨论类似情况的唯一消息来源是this，它根本不关心反应。

我不知道可以解决此问题的任何其他stackoverflow问题。如果您知道，请告诉我。

目前我正在做这样的事情（看起来很疯狂，是错误的）：

// my async function sets a resolve in State of the component
asyncFunction = () => {
  return new Promise((res, rej) => {
    this.setState({resolve: res, reject: rej, showForm: true})
  };
}

然后我调用resolve，当用户提供输入时，该状态可用：

// resolve promise on user input

    {showForm &&
      <form 
         onSubmit={() => {
          this.state.resolve(this.state.userInput) // <-- resolve is called here
          this.setState({showForm: false})
         }}
      >
        <label>
          Name:
          <input 
            type="text" 
            value={this.state.value} 
            onChange={e => this.setState({userInput: e.target.value})} 
          />
        </label>
        <input type="submit" value="Submit" />
      </form>
    }

仅在用户在React.js中提供输入后解决承诺

0 个答案: