Can't figure this simple problem

react
1

I’m not trying to do anything fancy, just load the data from a specific team and display properties.

When I access this page through a link, it’ll work. But if I refresh the page though, the page wont load and I get errors saying this.data.teamData is undefined.

Can anyone explain what I’m doing wrong? Thanks!

TeamManage = React.createClass({
    mixins: [ 
        // Array
        ReactMeteorData
    ],
    getMeteorData() {
        let handler = Meteor.subscribe("teams");
        let teamID = FlowRouter.getParam("teamID");
        arr = [];

        if (handler.ready()) {
            arr = Teams.find({_id: teamID}).fetch();
        } else {
            // Do something else?
        }
        return {
            teamData: arr
        }
    },
    render() {
        return(
            <div className="ui container page-body">
                <h1>{this.data.teamData[0].teamName}</h1>
                
                <TeamPlayerList />
            </div>
        )
    }
})
2

Try this (I didn’t test it):

TeamManage = React.createClass({
  mixins: [
    // Array
    ReactMeteorData
  ],
  getMeteorData() {
    let handler = Meteor.subscribe("teams");
    let teamID = FlowRouter.getParam("teamID");

    return {
      ready: handler.ready(),
      teamData: Teams.find(teamID).fetch()
    }
  },
  render() {
    return (
      <div className="ui container page-body">
        {this.data.ready ? (
          <h1>{this.data.teamData[0].teamName}</h1>
  
          <TeamPlayerList />
          ) : 'Loading...'}
      </div>
    )
  }
});