title: Changing state for multiple elements in page
body: <p>In my react-app i have a list that is rendered dynamically from an array, each item has a checkbox and an input, the input by default is disabled, when i click on the checkbox this input should be enabled if it meets a specific condition, i have managed to do some of the work, but I'm facing some issues like when i click on one of the checkboxes all inputs get enabled, and this input has a value i want to be able to edit it but i can't here is the code:</p>
  
  <p><strong>Initial state</strong></p>
  
  <pre><code>cards: [],
  disabledInput: false
  </code></pre>
  
  <p><strong>Mapping the list:</strong></p>
  
  <pre><code>return this.state.cards.map(card =&gt; (
  &lt;Checkbox key={card.id} onClick={this.setState({ disabledInput: true })} /&gt;
  &lt;Input value={this.state.card.name} disabled={this.state.disabledInput} onChange={e =&gt; this.setState({ text: e.target.value })} /&gt;
  ));
  </code></pre>