title: Using Async await in react component
body: <p>So I've created a component that shoots off post requests with props that I provide.</p>
  
  <p>Although I'm familiar with Async await I for some reason can't seem to get this to return the actual value of the fulfilled promise and instead just get pending.</p>
  
  <p>I've tried wrapping with more functions as I understand the promise is not being resolved.</p>
  
  <p>I feel like I'm missing something.</p>
  
  <p>A sample of my code below </p>
  
  <pre><code>export default class PostController extends React.Component {
  constructor(props) {
      super(props)
  }
  Wrapper = (body) =&gt; {
      try{
          let x = this.Send(body);
          return x;
          console.log(x)
      }catch(e){console.log(e)}
  }
  Send = async (body) =&gt; {
          try{
              let data = await this.Post(body);
              return data;
          }catch(e){console.warn(e)}       
  }
  Post = async (body) =&gt; {
      try{
          const options = {
              method: 'POST',
              uri: 'XXXXXXXXXXXXXXXXXXXX',
              body: body
          }
          const data = await rp(options);
          return data; 
      }catch(e){console.warn(e)}
  }
  render(props) {
      let jsonBody = JSON.stringify(this.props.data)
      const returnData = this.Wrapper(jsonBody)
      console.log(returnData)
  
          return(
              &lt;div&gt;
                   {(!this.props.data.pw) ? 'Retrieved Password: ' + returnData.message : 'Generated PassWord!:' + returnData.message }
              &lt;/div&gt;
          )
      }
  </code></pre>
  
  <p>}</p>