Erro ao executar o método componentDidMount()

Prezados,

ao executar o método componentDidMount() tenho a seguinte msg no browser:

Unhandled Rejection (TypeError): this.props.autores is not iterable
(anonymous function)
src/App.js:107
  104 | componentDidMount() {
  105 |   ApiService.ListaAutores()
  106 |     .then(res => {
> 107 |       this.setState({ autores: [...this.props.autores, ...res.data] });
      | ^  108 |     });
  109 | }
  110 | 

Conferi o meu código com o do professor e está idêntico, conforme abaixo:

const ApiService = {

    ListaAutores: () =>{
        return fetch('http://localhost:8000/api/autor')
            .then(res => res.json());
    },

    CriaAutor: autor =>{
        return fetch('http://localhost:8000/api/autor', {method: 'POST', headers: {'content-type': 'application/json'}, body: autor})
            .then(res => res.json());
    },

    ListaNomes: () =>{
        return fetch('http://localhost:8000/api/autor/nome')
            .then(res => res.json());
    },
    ListaLivros: () =>{
        return fetch('http://localhost:8000/api/autor/livro')
            .then(res => res.json());
    },
    RemoveAutor: id =>{
        return fetch(`http://localhost:8000/api/autor/${id}`, {method: 'DELETE', Headers: {'content-type': 'application/json'}})
        .then(res => res.json());
    }

}   
export default ApiService;

Verifiquei no console do browser que está dando o seguinte erro:

Uncaught (in promise) TypeError: this.props.autores is not iterable
    at App.js:107

Coloquei no render() do App.js a seguinte chamada para imprimir a lista de autores:

ApiService.ListaAutores().then(res => console.log(res.data));

No browser é apresentado um Array com 4 autores corretamente antes do erro mencionado acima. Ou seja, o resultado do comando acima seria iterável, ao meu ver.

Alguém saberia o que está ocorrendo !?