源码

import React, { Component, Fragment } from "react";class TodoList extends Component {
      constructor(props) {    super(props);    this.state = {      inputValue: "",      list: ["Learn React", "Play LOL"]    };  }  render() {    return (      
            
     
          
                
      Submit        
     
        
     
                {
   this.state.list.map((item, index) => {            return (              //这里不推荐直接用index来做为map的key              
      
                {item}              
            );          })}        
     
      
        );  }  // 提交输入  handleBtnClick(e) {    this.setState({      list: [...this.state.list, this.state.inputValue], //将输入添加到state中的list      inputValue: "" //清除inputValue    });  }  // 添加改变事件  handleInPutChange(e) {    this.setState({      inputValue: e.target.value //将输入映射到state    });  }  //添加删除事件  handleItemDelete(index) {    const list = [...this.state.list]; //复制原来的数组    list.splice(index, 1); //对副本进行删除    this.setState({      list: list //将修改之后的list赋值给state    });  }}export default TodoList;