title: Accessing variable from imported class from another React script
body: <p>I'm importing a class from another script in my main React App, and would like to access a variable within that class from the main App.  Basically the user types something into a textbox, then clicks a button to add that value to a variable.  In the main App I import that class, then have another button to print those values (selectedvalues).  I'm not entirely sure how to do it, but this is my code so far:</p>
  
  <p>Class I am importing:</p>
  
  <pre><code>import React, { Component } from 'react';
  
  class MyModule extends Component {
  
      constructor() {
          super();
          this.state = {
              selectedValues: '',
          }
       }
  
      addValue() {
          this.selectedValues += document.getElementById('textBox1').value + ', '
          return this.selectedValues  
      }
  
      render() {
          return(
              &lt;div&gt;
                  &lt;input type='text' id='textBox1' /&gt;
                  &lt;button onClick={() =&gt; this.addValue()}&gt;Add Value&lt;/button&gt;
              &lt;/div&gt;
          )
      }
    }
  
  export default MyModule
  </code></pre>
  
  <p>And where I would like to actually access that value</p>
  
  <pre><code>import React, { Component } from 'react';
  import MyModule from './myModule.js'
  
  class App extends Component {
  
      constructor() {
          super();
          this.state = {
  
          }
       }
  
      printValues() {
           console.log(document.getElementById('themodule').selectedvalues)
       }
  
      render() {
          return(
              &lt;MyModule id='themodule' /&gt;
              &lt;button onClick={() =&gt; printValues()}&gt;Print values&lt;/button&gt;
          )
      }
    }
  
  export default App
  </code></pre>
  
  <p>Is there a way I can do this?</p>
  
  <p>Thanks!</p>