title: React js, how to update state object values on input change?
body: <p>In React JS, I am trying to create a function that updates the state on the onChange event of an input field, with the value of the input.</p>
  
  <p>The state model has to stay like this, because I have to post it like this (to match API structure etc).</p>
  
  <p>But I don't know how to get to the 'answers' part of the state for each record.</p>
  
  <pre><code>// State --------------------------------------
  state = {
      values: [
        //1
        {
          section: "a",
          answers:
          {
              1a: 1,
              1b: 2,
              1c: 3,
              1d: 4,
              1e: 5
          }   
        },
        //2
        {
          section: "b",
          answers:
          {
              2a: 1,
              2b: 2,
              2c: 3,
              2d: 4,
              2e: 5,
              2f: 6,
              2g: 7,
              2h: 7
          }   
        }
     ]
  }
  
  // Set value ----------------------------------
    setValue = (key, val) =&gt; {
      this.setState((state) =&gt; ({ 
        values: {
          ...state.values,
          [key]: val
        }
      }));
    };
  
  // Handle input change ------------------------
    handleChange = key =&gt; e =&gt; {
      this.setValue(key, e.target.value)
    };
  
  //Usage ---------------------------------------
  &lt;input
     id="input1"
     type="number" 
     onChange={handleChange(values.1a)}
     defaultValue={values.1a}
  /&gt;
  &lt;input
     id="input2"
     type="number" 
     onChange={handleChange(values.2c)}
     defaultValue={values.2c}
  /&gt;
  </code></pre>