反应/反应本机：组件中的执行顺序

我无法弄清原始反应中的代码执行顺序。以下代码记录test,test 2，然后test 1。我想要更改submittedURI的值。反应/反应本机：组件中的执行顺序

constructor(props) { 
     super(props); 
     this.state = { 
      enterURI: '' 
     }; 
    } 

    onUriTextChanged(event) { 
     this.setState({ enterURI: event.nativeEvent.text }); 
    } 

    onSubmitPress() { 
     var submittedURI = this.state.enterURI; 
     console.log("test "+submittedURI); 

     var url = encodeURIComponent(submittedURI), data = null; 
     var xhr = new XMLHttpRequest(); 

     xhr.open("GET", "https://api.urlmeta.org/?url=" + url); 
     xhr.send(data); 
     xhr.addEventListener("readystatechange", function() { 
      if (this.readyState === this.DONE) { 
      // console.log(this.responseText); 
      var responseJSON = JSON.parse(this.responseText); 
      submittedURI = responseJSON.meta.image; 
      console.log("test 1 "+submittedURI); 
      } 
     }); 

     this.props.onURISubmit(submittedURI); 
     console.log("test 2 "+submittedURI); 
    }

来源

2016-09-25 user709413

在xhr.addEventListner("readystatechange", function() { ... })功能是一个回调，并得到的称为后请求DONE。因此在请求完成之前调用console.log("test 2 "+submittedURI);。

看到这里的文档（https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/onreadystatechange）

如果你想改变submittedURI你将不得不调用readystatechange回调中this.props.onURISubmit(submittedURI);功能。确保回拨具有访问this.props的正确上下文。

来源

2016-09-25 19:28:47 alecrobins

没错。谢谢您的帮助。当我调用'this.props.onURISubmit（submittedURI）;'readystatechange'内部时，我得到'undefined不是一个对象（评估'this.props.onURISubmit'）'。 – user709413

通过在另一个变量中存储'this'来解决这个问题。 – user709413

反应/反应本机：组件中的执行顺序

回答

相关问题