title: React: Cannot read property 'value' of undefined
body: <p>
  I´m trying to make a React calculator. I´m building my components for an initial test, and I can´t seem to get it to compile. I think i´m not passing state as props properly to the Display component, but I don´t really know what I´m doing wrong. </p>
  
  <pre class="lang-js prettyprint-override"><code>import React, { Component } from "react";
  import "./App.css";
  
  class Calculator extends Component {
    constructor(props) {
      super(props);
      this.state = { value: "[]" };
    }
  
    render() {
      return (
        &lt;div id="container"&gt;
          &lt;Button value={"1"} type="input" /&gt;
          &lt;Button value={"2"} type="input" /&gt;
          &lt;Button value={"3"} type="input" /&gt;
          &lt;Button value={"4"} type="input" /&gt;
          &lt;Button value={"5"} type="input" /&gt;
          &lt;Button value={"6"} type="input" /&gt;
          &lt;Button value={"7"} type="input" /&gt;
          &lt;Button value={"8"} type="input" /&gt;
          &lt;Button value={"9"} type="input" /&gt;
          &lt;Button value={"."} type="input" /&gt;
          &lt;Button value={"="} type="input" /&gt;
          &lt;Button value={"Clear"} type="input" /&gt;
          &lt;Button value={"add"} type="input" /&gt;
          &lt;Button value={"substract"} type="input" /&gt;
          &lt;Button value={"multiply"} type="input" /&gt;
          &lt;Button value={"divide"} type="input" /&gt;
          &lt;Display value={this.state.value} /&gt;
        &lt;/div&gt;
      );
    }
  }
  
  const Button = props =&gt; {
    return &lt;input type="Button" value={props.value} /&gt;;
  };
  
  const Display = props =&gt; {
    return (
      &lt;div&gt;
        &lt;p&gt;{props.state.value}&lt;/p&gt;
      &lt;/div&gt;
    );
  };
  </code></pre>