Как заполнить поле формы в компоненте Edit React?

Question

Я реализую компонент редактирования простого приложения BlogPost. Я не могу заполнить поле формы данными, полученными из api. Я зарегистрировал консоль и обнаружил, что данные ответа поступают после выполнения render (). Поэтому моя переменная состояния не обновляется перед установкой компонента. Пожалуйста, помогите.

class EditPost extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      title: '',
      text: ''
    }

  }

  componentDidMount() {
    axios.get('http://localhost:5000/api/posts/' + this.props.match.params.id)
      .then(res => (
        // console.log(res.data)
        this.setState({
          title: res.data.title,
          text: res.data.text
        })
      )).catch(err => console.log(err))
    // console.log(this.state.text)
    console.log(this.state.post)
  }

  handleChange = (e) => {
    this.setState({
      [e.target.name]: e.target.value
    })
  }

  handleSubmit = (e) => {
    e.preventDefault();
    console.log(this.state.text)
    console.log(this.state.title)
    const post = {
      title: this.state.title,
      text: this.state.text
    };

    axios.put('http://localhost:5000/api/posts/' + this.props.match.params.id, post)
      .then(res => console.log(res.data))

    // console.log(post);
    window.location = "/";
    this.setState({
      title: '',
      text: ''
    })
  }

  render() {
    console.log(this.state.title)

    // if (this.state.text && this.state.title) {
    return ( <
      div className = "container mx-auto mt-5"
      style = {
        {
          width: '50rem'
        }
      } >
      <
      div className = "text-center" >
      <
      h4 className = "font-weight-bold mb-4" > Edit POST < /h4> <
      Link to = "/" > < small className = "" > View All Posts < /small></Link >
      <
      hr / >
      <
      form onSubmit = {
        this.handleSubmit
      } >
      <
      div className = "form-group" >
      <
      input type = "text"
      ref = "userInput"
      name = "title"
      maxLength = "50"
      required placeholder = "Add Title..."
      className = "form-control"
      value = {
        this.state.title
      }
      onChange = {
        this.handleChange
      }
      /> < /
      div > <
      div className = "form-group" >
      <
      textarea name = "text"
      placeholder = "Add Body..."
      required className = "form-control"
      rows = "5"
      value = {
        this.state.text
      }
      onChange = {
        this.handleChange
      } > < /textarea> < /
      div > <
      input type = "submit"
      className = "btn btn-outline-primary" / >
      <
      /form> < /
      div >

      <
      /div>

    )
    // } else {
    //     return (<div>Error</div>)
    // }
  }
}
export default EditPost;

Я получаю ответ как тип объекта. Не знаю, почему он не обновляет вид компонента.