How to set state onChange for position in []?

Question

JavaScript

I have a table which is generated along with comment fields.

<Table responsive striped bordered condensed hover>
    <thead>
        <tr >
            <th>#</th>
            <th>Name</th>
            <th>Quantity</th>
        </tr>
    </thead>
    <tbody>
    {
        tabl.map( function(item,index)
     {
         return(
             <tr>
                 <th>{1+index}</th>
                 <th>{item.name}</th>
                 <th>{item.number}</th>
                 
                  <tr>
                     <th colSpan="3">
                         <Input type="textarea" />
                     </th>
             </tr>
             </tr> )}) }
    </tbody>
</Table>

I want to make a state in which I will drive the textarea values ​​into an array to the corresponding index
Something like this, but correct

<Input type="textarea"
    value={this.state.comments[index]}
    onChange={ (event)=> this.state.comments.splice(index, 0, event.target.value ) }
 />

Answer 1

Like this

onChange={ (event)=> {
    var comment = that.state.comments;
    comment[index] = event.target.value;
    that.setState({ comments: comment });
}}