componentDidMountは、私は以下のコードを持っている状態を設定または再レンダリング

Question

ません。 renderのconsole.logは実際に配列の長さを3にします。しかし、何も表示されません。

AuthorApi.js

//This file is mocking a web API by hitting hard coded data. 
var authors = require('./authorData').authors; 
var _ = require('lodash'); 

//This would be performed on the server in a real app. Just stubbing in. 
var _generateId = function(author) { 
    return author.firstName.toLowerCase() + '-' + author.lastName.toLowerCase(); 
}; 

var _clone = function(item) { 
    return JSON.parse(JSON.stringify(item)); //return cloned copy so that the item is passed by value instead of by reference 
}; 

var AuthorApi = { 
    getAllAuthors: function() { 
     console.log("Inside getAll"); 
     console.log("Authors length is : " + authors.length); 
     return _clone(authors); 
    }, 

    getAuthorById: function(id) { 
     var author = _.find(authors, {id: id}); 
     return _clone(author); 
    }, 

    saveAuthor: function(author) { 
     //pretend an ajax call to web api is made here 
     console.log('Pretend this just saved the author to the DB via AJAX call...'); 

     if (author.id) { 
      var existingAuthorIndex = _.indexOf(authors, _.find(authors, {id: author.id})); 
      authors.splice(existingAuthorIndex, 1, author); 
     } else { 
      //Just simulating creation here. 
      //The server would generate ids for new authors in a real app. 
      //Cloning so copy returned is passed by value rather than by reference. 
      author.id = _generateId(author); 
      authors.push(_clone(author)); 
     } 

     return author; 
    }, 

    deleteAuthor: function(id) { 
     console.log('Pretend this just deleted the author from the DB via an AJAX call...'); 
     _.remove(authors, { id: id}); 
    } 
}; 

module.exports = AuthorApi; 

私が間違って何をやっているお聞かせください。

Answer 1

地図の中にリターンを追加してみてください。

this.state.authors.map((author) => { 
         return (<tr key={author.id}> 
          <td><a href={"/#authors/" + author.id}>{author.id}</a></td> 
          <td>{author.firstName} {author.lastName}</td> 
         </tr>) 
        }, this)}