title: React component run error.Uncaught Error: Minified React error #31
body: <p>I am trying to return some <code>html</code> label when write <code>render</code> in my component. Code like this: </p>
  
  <pre><code> import React, {Component} from 'react';
  import Request from 'react-http-request';
  
  
  class NameForm extends React.Component {
  constructor() {
      super();
      this.state = {value: '', result: ''};
  
      this.handleChange = this.handleChange.bind(this);
      this.handleSubmit = this.handleSubmit.bind(this);
  }
  
  handleChange(event) {
      this.setState({value: event.target.value});
  }
  
  handleSubmit(event) {
      var content = this.state.value;
  
      var split = content.split(/\s+/);
  
      var queryObject = new Object();
  
      queryObject.law = null;
      queryObject.character = null;
      queryObject.lawRule = null;
      if (split.length == 1) {
          queryObject.law = split[0];
      }
      else if (split.length == 2) {
          queryObject.law = split[0];
          queryObject.character = split[1];
      }
      else if (split.length &gt; 2) {
          queryObject.law = split[0];
          queryObject.character = split[1];
          queryObject.lawRule = split[2];
      }
      // var json = JSON.stringify(queryObject);
      var json = "{\"law\":\"军工企业股份制改造实施暂行办法\",\"character\":\"第二章\"}";
  
      var test = JSON.stringify(&lt;Fetchs args={json}/&gt;);
  
  
      var request = new XMLHttpRequest();
      request.open('POST', 'http://localhost:8080/path', false);
      request.setRequestHeader('Content-Type', 'application/json');
      var resp = '';
      request.onreadystatechange = function (e) {
          if (this.status == 200) {
              resp = this.response;
          }
      }
  
      request.send(json);
  
      // console.info("XMLHttpRequest test is " + JSON.stringify(resp));
  
      // console.info("test is " + resp);
  
      this.setState({result: resp});
  
      event.preventDefault();
  }
  
  
  render() {
  
      // console.log("prite"+this.state.result.queryResults);
      // console.log("100"+this.strToJson(this.state.result));
      // console.log("200"+this.strToJson(this.state.result.queryResults));
      // alert(this.state.result);
  
      var parse = JSON.parse(this.state.result ? this.state.result : null);
      var out = parse ? parse.queryResults : null;
      for (var i = 0; out != null &amp;&amp; i &lt; out.length; i++) {
          if (out[i].keyword == null) {
              out[i].keyword = "{}";
              console.info("keyword is null");
          }
          else {
              // this.state.result.queryResults.keyword
              console.info("keword is not null");
              out[i].keyword = JSON.stringify(out[i].keyword);
          }
      }
  
  
      return (
          &lt;div&gt;
              &lt;form onSubmit={this.handleSubmit}&gt;
                  &lt;label&gt;
                      Name:
                      &lt;input type="text" value={this.state.value} onChange={this.handleChange}/&gt;
                  &lt;/label&gt;
                  &lt;input type="submit" value="Submit"/&gt;
              &lt;/form&gt;
              &lt;table border="10" &gt;
                  &lt;tr&gt;
                      &lt;thead&gt;
                      &lt;th&gt;GraphName&lt;/th&gt;
                      &lt;th&gt;Relation&lt;/th&gt;
                      &lt;th&gt;Content&lt;/th&gt;
                      &lt;th&gt;KeyWord&lt;/th&gt;
                      &lt;/thead&gt;
                  &lt;/tr&gt;
                  &lt;tbody&gt;
  
                  {out}
                  &lt;/tbody&gt;
              &lt;/table&gt;
  
          &lt;/div&gt;
      );
   }
  }
  
  
  ReactDOM.render(&lt;NameForm/&gt;, document.getElementById('react'))
  </code></pre>
  
  <p><code>out</code> is a array parsed from json data, like this:</p>
  
  <p><a href="https://i.stack.imgur.com/AiLii.png" rel="noreferrer"><img src="https://i.stack.imgur.com/AiLii.png" alt="enter image description here"></a></p>
  
  <p>My problem is that I want show <code>out</code> on page by <code>table</code> label, But use <code>{out}</code> I get a error, like this:
  <a href="https://i.stack.imgur.com/M1FGX.png" rel="noreferrer"><img src="https://i.stack.imgur.com/M1FGX.png" alt="enter image description here"></a></p>
  
  <p>What troubled me is how to show <code>out</code> array in a table. </p>