title: Warning: You provided a `checked` prop to a form field without an `onChange` handler
body: <p>I'm getting this warning with my JS React Bootstrap code.</p>
  <blockquote>
  <p>Warning: You provided a <code>checked</code> prop to a form field without an <code>onChange</code> handler. This will render a read-only field. If the field should be mutable use <code>defaultChecked</code>. Otherwise, set either <code>onChange</code> or <code>readOnly</code>.</p>
  </blockquote>
  <p>My code is working exactly as intended, so the warning isn't causing any functionality issues, but still, I'd like to resolve it.</p>
  <p>Here's the code that's causing the warning:</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;View style={{flexDirection: "row"}}&gt;
    &lt;View style={{flex: 1}}&gt;
      &lt;Form.Group&gt;
        &lt;Form.Label&gt;Availability&lt;/Form.Label&gt;
        &lt;div onChange={ (e) =&gt; this.handleInput(e, "listing")}&gt;
          &lt;Form.Check checked={(this.state.listing.availability === "募集中")} type="radio" value="募集中" name="availability" label="募集中"/&gt;
          &lt;Form.Check checked={(this.state.listing.availability === "契約済")} type="radio" value="契約済" name="availability" label="契約済"/&gt;
        &lt;/div&gt;
      &lt;/Form.Group&gt;
    &lt;/View&gt;
    &lt;View style={{flex: 1.1}}&gt;
      &lt;Form.Group&gt;
        &lt;Form.Label&gt;Property Type&lt;/Form.Label&gt;
        &lt;div onChange={ (e) =&gt; this.handleInput(e, "property")}&gt;
          &lt;Form.Check checked={(this.state.property.property_type === "一戸建て")} type="radio" value="一戸建て" name="property_type" label="一戸建て"/&gt;
          &lt;Form.Check checked={(this.state.property.property_type === "アパート")} type="radio" value="アパート" name="property_type" label="アパート"/&gt;
        &lt;/div&gt;
      &lt;/Form.Group&gt;
    &lt;/View&gt;
    &lt;View style={{flex: 0.9}}&gt;
      &lt;Form.Group&gt;
        &lt;Form.Label&gt;Interest&lt;/Form.Label&gt;
        &lt;div onChange={ (e) =&gt; this.handleInput(e, "property")}&gt;
          &lt;Form.Check checked={(this.state.property.interest === "Extremely")} type="radio" value="Extremely" name="interest" label="Extremely"/&gt;
          &lt;Form.Check checked={(this.state.property.interest === "Kinda")} type="radio" value="Kinda" name="interest" label="Kinda"/&gt;
          &lt;Form.Check checked={(this.state.property.interest === "Nah")} type="radio" value="Nah" name="interest" label="Nah"/&gt;
        &lt;/div&gt;
      &lt;/Form.Group&gt;
    &lt;/View&gt;
   &lt;/View&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>I have certain reasons for formatting things this way, but I'm totally open to suggestions. Really, I just want get rid of the warning with changing this code as little as possible.</p>
  <p>I saw there were other questions addressing this issue, but I couldn't find a solution that works with my code.</p>