CODEWITHSUNDEEP
javascriptnode.jsmeteorreactjsecmascript-6
milan
milan

Reputation: 2417

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.

Upvotes: 0

Views: 2413

Answers (1)

Andreas Louv
Andreas Louv

Reputation: 47119

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;
}

Upvotes: 1

Related Questions