milan milan - 6 months ago 30
Node.js Question

Cannot read property 'currentUser' of undefined

I get an error while redirecting to dashboard page. The error is in Navbar component. I have used ReactMeteorData mixin. My code is

const ReactMeteorDataWrap = (BaseComponent)=>{
return class ExportClass extends Component {
getMeteorData(){
let data = {};
console.log(Meteor.user()); // shows undefined in console
data.currentUser = Meteor.user();
console.log('data',data);
return data;
}
render(){
return <BaseComponent getMeteor={()=>this.getMeteorData()}
{...this.props}></BaseComponent>
}
}
}

export default ReactMeteorDataWrap;


Navbar.jsx which uses ReactMeteorData mixins

import ReactMeteorDataWrap from '../ReactMeteorDataWrap.jsx';

class Navbar extends Component {
constructor(props){
super(props);
this.state = { searchText: '' };
this.props.getMeteor();
}
//getMeteorData() {
// this.props.getMeteor();
//}


componentDidMount(){
var users = Meteor.users.find({},{fields:{'profile':1}}).fetch();
var usernames = [];
users.map(function(user){
usernames.push(user.profile.fullname);
});
$('#typeahead').typeahead({
name: 'users',
local: usernames
});
}

handleSubmit(e){
e.preventDefault();
FlowRouter.go('/user/' + (this.refs.searchText.value).trim());
}

render() {
var fullname = '';
if(this.data.currentUser && this.data.currentUser.profile){
fullname = this.data.currentUser.profile.firstname + ' ' + this.data.currentUser.profile.lastname; // error is shown here
}
return ();
}

export default ReactMeteorDataWrap(Navbar);


I get undefined while consoling Meteor.user() in ReactMeteorDataWrap and cannot read property 'currentUser' in Navbar.jsx render function.

Answer

AFAI can see You should take the currentUser from this.props not this.data:

render() {
  var fullname = '';
  var currentUser = this.props.currentUser;
  if(currentUser && currentUser.profile) {
    fullname = `${currentUser.profile.firstname} ${currentUser.profile.lastname}`;
    // use fullname for something...
  }
  return;
}
Comments