Tracker.autorun with React Not working

help
1

Hello guys I am stuck in a problem and that is I am using tracker.autorun on client side it is returning empty array at initial run and this empty array gets passes to my rendering react components. This throws error. Is there any way to hadle it?

Below is the code

Meteor.startup(function() {
Tracker.autorun(function (){
let players = Players.find().fetch();
let title = “Score Keep”;
let name = “asadaziz”;
let jsx = (


{title}


Hello {name}


This is from main.js


{renderPlayers(players)}

);
ReactDOM.render(jsx, document.getElementById(“app”));
})
});

const renderPlayers = function(playersList) {
return players.map(function(player) {
return (


{player.name} has {player.score} point(s).


);
});
2

I suggest you use withTracker (is there a reason you are using Tracker?)

Also, how are you getting the data into the client - subscriptions or method?

If subscriptions, simple do a check to ensure that the sub is ready:

const handle = Meteor.subscribe('subName');
const loading = !handle.ready();

// In your react render
render() {
  if (this.props.loading) {
    return null; // Or an empty div or a loading indicator...
  }
  return <DataComponentHere />
}
3

If you do suggest withTracker, might I suggest that your examples actually show you using it? :wink:

const MyComponent = (props) => {
     if (props.loading) {
          return (<></>);
     }
     return (
          <div>{props.data.name}</div>
     )
}

export default MyComponentContainer = withTracker((props) => {
    const dataHandle = Meteor.subscribe("data");
    const data = DataCollection.findOne({_id: props._id}).fetch();
    return {
        data: data,
        loading: !dataHandle.ready();
    }
}