为什么我的接头会删除除第一个之外的所有接头，而不是仅删除指定的接头？

Question

For a given array, when I run the splice everything but the first entry is deleted. However I would expect only the selected entry to be deleted. I suspect this has something to do with how my i is set up but I'm not sure what the problem is.

removethisone = (i) => {this.setState(state=>({list: state.list.splice(i,1)}))}

    <ul>
    {this.state.list.map((entry, i)=><li key={i}><button onClick={this.removethisone}>{i+1}</button>{entry}</li>)}
    </ul>

Answer 1

Your code is working exactly as you described because that is how splice works .

The splice method returns an array of the items that are removed. You are storing the items you removed back into the state. Hence why you get what you removed.

removethisone = (i) => {
  this.setState(state => {
    const list = state.list;
    const removedElems = list.splice(i, 1);
    console.log(removedElems);
    return {
      list
    }
  })
}

Answer 2

The reason this is happening is because the Array.splice method returns the removed items from the array.

You need to do something like this:

removethisone = (i) => {
  this.setState(state => {
    const nextState = [ ...state.list ]
    nextState.splice(i, 1)

    return { list: nextList }
  })
}

For example, run the code below to see the ouput:

 // This is what your code does let numbers = [1, 2, 3, 4, 5]; let removedNumbers = numbers.splice(2, 1) numbers = removedNumbers console.log(numbers); console.log(removedNumbers);