reactjs - React useState、入力の値が更新されない

Question

jsonに基づいて入力を生成したいので、最初に初期状態に設定し、次に子コンポーネントでフィールドを変更したいのですが、コンポーネントは更新されません...一度レンダリングされ、それをどのようにするかわかりません入力 onChange がその値を変更するたびに更新されます。何かを入力するたびに入力の値を更新する方法はありますか?

親

 function App() {
      const [inputValue, setInputValue] = useState(chunkingRow);


  const handleChunkingChange = (e, index) => {
    let inputContent = inputValue;
    const reg = new RegExp(/^[0-9]+$/);

    if (e.target.value.match(reg)) {
      inputContent[index] = {
        ...inputContent[index],
        content: e.target.value,
      };

      setInputValue(inputContent);
      console.log(inputValue);
    } else console.log('not a number')
  };

  return (
    <div>
      <Wrapper>
        {Chunk(inputValue, handleChunkingChange)}
      </Wrapper>
    </div>
  );
}

子

const Chunk = (inputValue, handleChunkingChange) => {

return(
  <div>
    {inputValue.map((el, index) => (
      <div key={index}>
        <p>{el.title}</p>
        {console.log(el.content)}
        <input
          type="text"
          onChange={(e, i) => handleChunkingChange(e, index)}
          value={el.content}
        />
      </div>
    ))}
  </div>
);
}

デモへのリンク https://codesandbox.io/s/stoic-mirzakhani-46exz?file=/src/App.js