dimanche 21 mars 2021

Warning: You provided a `checked` prop to a form field without an `onChange` handler

I'm getting this warning with my JS React code.

Warning: You provided a checked prop to a form field without an onChange handler. This will render a read-only field. If the field should be mutable use defaultChecked. Otherwise, set either onChange or readOnly.

My code is working exactly as intended, so the warning isn't causing any functionality issues, but still, I'd like to resolve it.

Here's my code:

<View style=>
  <View style=>
    <Form.Group>
      <Form.Label>Availability</Form.Label>
      <div onChange={ (e) => this.handleInput(e, "listing")}>
        <Form.Check checked={(this.state.listing.availability === "募集中")} type="radio" value="募集中" name="availability" label="募集中"/>
        <Form.Check checked={(this.state.listing.availability === "契約済")} type="radio" value="契約済" name="availability" label="契約済"/>
      </div>
    </Form.Group>
  </View>
  <View style=>
    <Form.Group>
      <Form.Label>Property Type</Form.Label>
      <div onChange={ (e) => this.handleInput(e, "property")}>
        <Form.Check checked={(this.state.property.property_type === "一戸建て")} type="radio" value="一戸建て" name="property_type" label="一戸建て"/>
        <Form.Check checked={(this.state.property.property_type === "アパート")} type="radio" value="アパート" name="property_type" label="アパート"/>
      </div>
    </Form.Group>
  </View>
  <View style=>
    <Form.Group>
      <Form.Label>Interest</Form.Label>
      <div onChange={ (e) => this.handleInput(e, "property")}>
        <Form.Check checked={(this.state.property.interest === "Extremely")} type="radio" value="Extremely" name="interest" label="Extremely"/>
        <Form.Check checked={(this.state.property.interest === "Kinda")} type="radio" value="Kinda" name="interest" label="Kinda"/>
        <Form.Check checked={(this.state.property.interest === "Nah")} type="radio" value="Nah" name="interest" label="Nah"/>
      </div>
    </Form.Group>
  </View>
 </View>

I have certain reasons for formatting things this way, but I'm totally open to suggests. Really, I just want get rid of the warning with changing this code as little as possible.

I saw there were other questions addressing this issue, but I couldn't find a solution that works with my code.




Aucun commentaire:

Enregistrer un commentaire