Réponse non rendue par axios get request in react

J'ai le code suivant

import React, { Component } from "react";
import { Link } from "react-router-dom";
import swal from "sweetalert";
import axios from "axios";

class Journal extends Component {
  constructor() {
    super();
    this.state = {
      journal: {
        title: "",
        content: "",
        createdAt: ""
      }
    };
  }

  componentDidMount() {
    let postId = this.props.match.params.id;
    axios
      .get("/api/journals/" + postId)
      .then(journal => this.setState({ journal }))
      .catch(error => {
        console.log(error);
      });
  }

  delete(id) {
    let postId = this.props.match.params.id;
    swal({
      title: "Are you sure?",
      text: "Once deleted, you will not be able to recover this journal!",
      icon: "warning",
      buttons: true,
      dangerMode: true
    }).then(willDelete => {
      if (willDelete) {
        axios.delete("/api/journals/" + postId).then(result => {
          this.props.history.push("/journals");
        });
        swal("Poof! Your journal has been deleted!", {
          icon: "success"
        });
      } else {
        swal("Your journal is safe!");
      }
    });
  }

  render() {
    return (
      <>
        <div className='p-12 text-gray-800'>
          <section className='max-w-3xl m-auto'>
            <article>
              <div className='text-center'>
                <h1 className='title'>{this.state.journal.title}</h1>

                <span className='text-sm'>{this.state.journal.createdAt}</span>
              </div>

              <div className='text-sm mt-10 mb-4'>
                {this.state.journal.content}
              </div>
            </article>

            <div className='mt-8 mx-auto text-center w-full'>
              <hr />
              <div className='my-4'>
                <Link
                  to={`/dashboard/journals/${this.props.match.params.id}/edit`}
                  className='btn btn-edit'
                >
                  Edit
                </Link>
                <span className='text-gray-200 mx-4'>|</span>
                <button
                  onClick={this.delete.bind(this)}
                  className='w-20 btn btn-delete'
                >
                  Delete
                </button>
              </div>
              <hr />
            </div>
          </section>
        </div>
      </>
    );
  }
}

export default Journal;

L'utilisation de l'extraction de toutes les données de setState est rendue, c'est-à-dire

fetch("/api/journals/" + postId)
 .then(res => res.json())
 .then(journal => this.setState({ journal }))
 .catch(error => {
   console.log(error);
});

Cela marche.

Cependant, comme je retourne une réponse JSON, Axios semble le meilleur choix. De plus, je cherche à l'utiliser de toute façon.

Mais pour autant que je sache, je configure correctement l'état à l'aide d'axios et j'obtiens une réponse de 200, mais les données ne s'affichent pas.