~~~ import React, { Component } from "react"; class App extends Component { constructor(props) { super(props); this.state = { value: "hello world", list: [] } } render() { return ( <div> <input value={this.state.value} onChange={this.handleChange.bind(this)} /> <button onClick={this.handleClick.bind(this)}>增加</button> <ul> {this.state.list.map((item, index) => { return <li key={index} onClick={this.handleDelete.bind(this,index)}> {item}</li> })} </ul> </div> ) } handleChange(e) { this.setState({ value: e.target.value }) } handleClick() { var list = this.state.list; if (!list.includes(this.state.value)) { list.push(this.state.value); } this.setState({ list, value:"" }) } handleDelete(index){ //不能直接修改state中的list var list = this.state.list; list.splice(index,1); this.setState({ list }) } } ~~~