用React /流星应用程序显示用户数据

Question

我一直在尝试各种方法来显示来自React模板中流星提取的数据。我不完全明白为什么这很难做到。

当我在模板中使用getMeteorData它不使用{} this.data.user._id使用时，当componentDidMount显示数据

getMeteorData() { 
    return { 
     user: Meteor.user() 
    }; 
    }, 

这是同样的故事。

我按照流星网站上的反应&流星教程，他们使用道具。然而，这对于简单地提取和提取数据感到很多工作。

这是企图

export var MenuLoggedIn = React.createClass({ 
    displayName: 'MenuLoggedIn', 
    mixins: [ 
    Router.State, Router.Navigation 
    ], 
    getMeteorData() { 
    return { 
     user: Meteor.user() 
    }; 
    }, 
    getInitialState(){ 
    return { 
     avatarImagePreview: null, 
     avatarImage: null 
    }; 
    }, 

    render: function() { 
    return (
     <div className="container"> 
     <div className="menu-structure col-md-12"> 

      {this.data.user._id} 

      <div className="left-menu pull-left"> 
      <img className="logo" src="/img/logo.png"/> 
      <h1 className="eventburger-title">eventburger</h1> 
      </div> 
      <div className="right-menu"> 
      <div className="search-bar"> 
       <i className="fa fa-search"></i> 
       <input type="text" name="Search" placeholder="Harpist, Photographer, Caterer..."/> 
      </div> 

      {this.data 
       ? <img src="/img/avatar.png"/> 
       : <img src="/img/placeholder-person.jpg"/>} 

      <span>{this.data} 
       Feeney</span> 

      <a href="/app/inbox"> 
       <i className="fa fa-envelope"></i> 
      </a> 
      <a className="head-spacing" href="#" onClick={this.logout}>LOG OUT</a> 
      </div> 
     </div> 
     </div> 
    ); 
    }, 
    logout: function(e) { 
    e.preventDefault(); 
    Meteor.logout(); 
    window.location.href = "/login"; //Need to be moved to History 
    } 
}); 

Answer 1

您需要使用ReactMeteorData混入，使getMeteorData()工作的一个例子。

mixins: [ 
    Router.State, Router.Navigation, ReactMeteorData 
], 

https://atmospherejs.com/meteor/react-meteor-data