Estoy luchando por descubrir cómo esperar alMeteor.user() suscripción en un componente de reacción. Sé que el usuario ha iniciado sesión porqueMeteor.userId() devuelve el_id, pero intentando acceder a la dirección de correo electrónicoMeteor.user() devuelve indefinido. Supongo que todavía no está disponible.

Por desgracia, dado que Meteor.user () no es una publicación a la que me suscribo manualmente, no estoy seguro de cómo esperarla en un componente React. ¿Alguien puede señalarme un ejemplo?

import { Meteor } from 'meteor/meteor';
import React from 'react';
import { Link } from 'react-router';
import { createContainer } from 'meteor/react-meteor-data';

import './BaseLayout.scss';


class BaseLayout extends React.Component {

    constructor(props) {
        super(props);

        this.state = {
            isAuthenticated: (Meteor.userId() !== null) ? true : false,
        }
    }

    componentWillMount() {
        if (!this.state.isAuthenticated) {
            this.context.router.push('/login');
        }
    }

    componentDidUpdate(prevProps, prevState) {
        if (!this.state.isAuthenticated) {
            this.context.router.push('/login');
        }
    }

    toggleUserMenu() {
        this.refs.userMenu.style.display = (this.refs.userMenu.style.display === 'block') ? 'none' : 'block';
    }

    logout(e) {
        e.preventDefault();
        Meteor.logout();
        this.context.router.push('/login');
    }

    render() {
        return(
            <div id="base">
                <div id="header">
                    <div id="top-bar" className="clear-fix">
                        <div className="float-left" id="logo"></div>
                        <div className="float-right" id="user-menu">
                            <div onClick={this.toggleUserMenu.bind(this)}>
                                <span>{this.props.currentUser.emails[0].address}</span>
                                <div className="arrow-down"></div>
                            </div>
                            <div id="user-menu-content" ref="userMenu">
                                <a onClick={this.logout.bind(this)}>Sign Out</a>
                            </div>
                        </div>
                    </div>
                </div>
                <div id="bodyContainer">
                    {this.props.children}
                </div>
                <div id="footer">
                    <ul>
                        <li><a href="mailto:[email protected]">Made by Us</a></li>
                    </ul>
                </div>
            </div>
        )
    }
}
BaseLayout.contextTypes = {
    router: React.PropTypes.object.isRequired,
}


export default BaseLayoutContainer = createContainer(() => {

    var handle = Meteor.subscribe("user.classrooms");

    return {
        currentUser: Meteor.user(),
        dataLoading: !handle.ready(),
        classrooms: Classrooms.find({}).fetch(),
    };
}, BaseLayout);