title: get promise value in react component
body: <p>I have a helper function in my component. When I <code>console.log(helperFunction())</code> it, I get this in the console.</p>
  
  <p><a href="https://i.stack.imgur.com/ITEu8.png" rel="noreferrer"><img src="https://i.stack.imgur.com/ITEu8.png" alt="enter image description here"></a></p>
  
  <p>When I try to add the helper function to an input field for its value. I get this showing up.</p>
  
  <p><a href="https://i.stack.imgur.com/xQDah.png" rel="noreferrer"><img src="https://i.stack.imgur.com/xQDah.png" alt="enter image description here"></a></p>
  
  <p>How do I get the <code>[[PromiseValue]]</code> in my input?</p>
  
  <pre><code>  render() {
      console.log(getProjectName());
      return (
        &lt;form ref={(input) =&gt; this.eventForm = input} onSubmit={(e) =&gt; this.createEvent(e)} className="slds-form"&gt;
          &lt;div className="slds-form-element"&gt;
            &lt;label className="slds-form-element__label"&gt;Assigned To&lt;/label&gt;
            &lt;div className="slds-form-element__control"&gt;
              &lt;input ref={(input) =&gt; this.assigned = input} type="text" className="slds-input"  disabled/&gt;
            &lt;/div&gt;
          &lt;/div&gt;
          &lt;div className="slds-form-element"&gt;
            &lt;label className="slds-form-element__label"&gt;Related To&lt;/label&gt;
            &lt;div className="slds-form-element__control"&gt;
              &lt;input ref={(input) =&gt; this.related = input} type="text" className="slds-input" defaultValue={getProjectName()} disabled/&gt;
            &lt;/div&gt;
          &lt;/div&gt;
          &lt;div className="slds-form-element"&gt;
            &lt;label className="slds-form-element__label"&gt;Subject&lt;/label&gt;
            &lt;div className="slds-form-element__control"&gt;
              &lt;input ref={(input) =&gt; this.subject = input} type="text" className="slds-input"/&gt;
            &lt;/div&gt;
          &lt;/div&gt;
          &lt;div className="slds-form-element"&gt;
            &lt;label className="slds-form-element__label"&gt;Location&lt;/label&gt;
            &lt;div className="slds-form-element__control"&gt;
              &lt;input ref={(input) =&gt; this.location = input} type="text" className="slds-input" /&gt;
            &lt;/div&gt;
          &lt;/div&gt;
          &lt;div className="slds-form-element"&gt;
            &lt;label className="slds-form-element__label"&gt;Event Start&lt;/label&gt;
            &lt;div className="slds-form-element__control"&gt;
              &lt;input ref={(input) =&gt; this.start = input} type="text" onChange={(e) =&gt; this.onChange(e)} className="slds-input" value={ this.state.start }/&gt;
            &lt;/div&gt;
          &lt;/div&gt;
          &lt;div className="slds-form-element"&gt;
            &lt;label className="slds-form-element__label"&gt;Event End&lt;/label&gt;
            &lt;div className="slds-form-element__control"&gt;
              &lt;input ref={(input) =&gt; this.end = input} type="text" onChange={(e) =&gt; this.onChange(e)} className="slds-input" value={ this.state.end } /&gt;
            &lt;/div&gt;
          &lt;/div&gt;
          &lt;div className="slds-form-element"&gt;
            &lt;label className="slds-form-element__label"&gt;Contact&lt;/label&gt;
            &lt;div className="slds-form-element__control"&gt;
              &lt;input ref={(input) =&gt; this.contact = input} type="text" className="slds-input" disabled/&gt;
            &lt;/div&gt;
          &lt;/div&gt;
          &lt;button type="button" className="slds-button slds-button--neutral"&gt;Cancel&lt;/button&gt;
          &lt;button type="submit" className="slds-button slds-button--brand"&gt;Create&lt;/button&gt;
        &lt;/form&gt;
      );
    }
  </code></pre>
  
  <p>Helper Function</p>
  
  <pre><code>import axios from 'axios'
  
  export function getProjectName() {
  
    return new Promise(function(resolve,reject){
  
    // gets the record id from the current url
    function getQueryVariable(variable) {
      var query = window.location.search.substring(1);
      var vars = query.split("&amp;");
  
      for (var i=0;i&lt;vars.length;i++) {
        var pair = vars[i].split("=");
        if(pair[0] == variable){return pair[1];}
      }
  
      return(false);
    }
  
    // used to access the rest api on my system
    const REST_API_URL = restApiUrl;
    const API_TOKEN = {
      headers: { "Authorization" : "Bearer " + sessionId,
                "Content-Type" : "application/json"
               }
    }
    const OPPORTUNITY_QUERY = "SELECT+Id,Name+FROM+OPPORTUNITY+WHERE+Id="
  
    // get projectId
    const id = getQueryVariable('projectId');
  
    // make requst for record name
    var request = axios.get(`${REST_API_URL}query/?q=${OPPORTUNITY_QUERY}'${id}'`,
       API_TOKEN
     ).then(function (response){
        return resolve(response.data.records[0].Name);
     })
    })
  }
  </code></pre>