小编fin*_*oss的帖子

在渲染之前在服务器中重新获取数据

我是reactjs的新手,我想在服务器中获取数据,以便它将向客户端发送包含数据的页面.

当函数getDefaultProps返回虚拟数据时,这是可以的,例如{data:{books:[{..},{..}]}}.

但是不能使用下面的代码.代码按此顺序执行,并显示错误消息"无法读取未定义的属性'书籍'

  1. getDefaultProps
  2. 返回
  3. {data:{books:[{..},{..}]}}

但是,我希望代码应按此顺序运行

  1. getDefaultProps
  2. {data:{books:[{..},{..}]}}
  3. 返回

任何的想法?

statics: {
    fetchData: function(callback) {
      var me = this;

      superagent.get('http://localhost:3100/api/books')
        .accept('json')
        .end(function(err, res){
          if (err) throw err;

          var data = {data: {books: res.body} }

          console.log('fetch');                  
          callback(data);  
        });
    }


getDefaultProps: function() {
    console.log('getDefaultProps');
    var me = this;
    me.data = '';

    this.fetchData(function(data){
        console.log('callback');
        console.log(data);
        me.data = data;      
      });

    console.log('return');
    return me.data;            
  },


  render: function() {
    console.log('render book-list');
    return (
      <div>
        <ul>
        {
          this.props.data.books.map(function(book) {
            return <li key={book.name}>{book.name}</li>
          })
        } …
Run Code Online (Sandbox Code Playgroud)

reactjs

34
推荐指数
4
解决办法
7万
查看次数

标签 统计

reactjs ×1