title: React Components, MongoDB and passing a Key - TypeError: Cannot read property '_id' of undefined
body: <p>So I'm trying to pass a field from a MongoDB into a React Component as such: </p>
  
  <pre><code>import React from 'react';
  import ReactDOM from 'react-dom';
  import { Meteor } from 'meteor/meteor';
  import { Tracker } from 'meteor/tracker';
  import { Players } from './../imports/api/players';
  import TitleBar from './../imports/UI/TitleBar';
  import AddPlayer from './../imports/UI/AddPlayer';
  import Player from './../imports/UI/Player';
  
  const renderPlayers = (playersList) =&gt; {
      return playersList.map((player) =&gt; {
          return &lt;Player key={player._id} /&gt;;
      });
  };
  </code></pre>
  
  <p>But the component isn't able to read the passed in player._id value. </p>
  
  <pre><code>import React from 'react';
  import { Players } from './../api/players';
  
  export default class Player extends React.Component {
      render() {
          return (
              &lt;p key={this.props.player._id}&gt;
                  {this.props.player.name} has {this.props.player.score} point(s).
                  &lt;button onClick={() =&gt; {Players.update(this.props.player._id, { $inc: { score: 1 } });}}&gt;+1&lt;/button&gt;
                  &lt;button onClick={() =&gt; {Players.update(this.props.player._id, { $inc: { score: -1 } });}}&gt;-1&lt;/button&gt;
                  &lt;button onClick={() =&gt; Players.remove(this.props.player._id)}&gt;x&lt;/button&gt;
              &lt;/p&gt;
          );
      }
  }
  </code></pre>
  
  <p>Functionality wise - the code works as intended - just not as a component here because player._id isn't able to be passed in. How do I go about passing the player._id field in properly?</p>
  
  <blockquote>
    <p>Error: TypeError: Cannot read property '_id' of undefined</p>
  </blockquote>
  
  <p>I thought it might be because there was no data entries in the DB - but I made sure to make a few beforehand and test that, didn't work unfortunately.</p>