2017-05-08 3 views
1

제가 아래의 코드가 설정되지. render의 console.log는 배열 길이를 3으로 지정하지만 아무 것도 표시되지 않습니다.componentDidMount 상태 또는 재 렌더링

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; 

은 제가 뭘 잘못 알려 주시기 바랍니다.

+0

사용하기 전에 약속을 해결'내가 uthorApi.getAllAuthors() 그 때는() 고해상도 => this.setState ({입술 저자})를 사용하려고 – lux

+0

안녕을 setState' 함수. 저자 API 코드로 질문을 업데이트했습니다. –

답변

2

지도 내부에 반품을 추가하십시오. 하지만 오류가 다음 말있어되지 않습니다 :

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)} 
+0

네, 효과가있었습니다. 고마워요 :) –

+0

나는 실제 AJAX 호출을해야한다면 여전히 componentDidMount() 메서드에서 올바르게 처리해야합니까? –

관련 문제