這是所有代碼：import React, { Component } from "react";import "./App.css";import Slider from "@material-ui/core/Slider";import Typography from "@material-ui/core/Typography";class App extends Component {  state = {    users: [],  };  componentDidMount() {    fetch("/users").then((response) =>      response.json().then((data) => {        this.setState({ users: data.users });      })    );  }  removeSlider(user) {    const users = [...this.state.users];    users.splice(users.indexOf(user), 1);    this.setState({ users: users });  }  render() {    return (      <div className="App">        {this.state.users.map((user) => (          <div className="slider" id="di">            <Typography id="range-slider" gutterBottom>              <button className="btn" onClick={() => this.removeSlider(user)}>                {user.first_name[0].toUpperCase() + user.first_name.slice(1)}              </button>            </Typography>            <Slider              orientation="vertical"              defaultValue={[0, 50]}              aria-labelledby="vertical-slider"            />          </div>        ))}      </div>    );  }}export default App;用戶來自另一臺服務器。在排版中，每個用戶都有一個按鈕，該按鈕實質上是將他們從用戶列表中刪除（由 removeSlider 處理程序處理）。這里的問題是，當我這樣做時，與列表末尾對應的滑塊被刪除，而不是我想要刪除的滑塊。所以在圖片中我去刪除 Jordan，但是 Imagine 的滑塊被刪除了。不過，喬丹實際上已從用戶列表中刪除。任何幫助，將不勝感激。