课程
下载APP
源自:2-2 完成新增列表项的功能

add之后出现多个li,检查了几遍看不出什么问题

import React from 'react';
class TodoList extends React.Component{
 constructor(props){
   super(props)
   this.state = {
     list:[],
     inputValue:"",
   }
 }
 addItem(){
   this.setState({
       list:[this.state.list,this.state.inputValue],
       inputValue:""
     })
 }
 todoListText(e){
   this.setState({
     inputValue:e.target.value
   })
 }
 render(){
   return(
     <div>
       <div>
         <input value={this.state.inputValue} onChange={this.todoListText.bind(this)} />
         <button onClick={this.addItem.bind(this)}>add</button>
       </div>
       <ul>
         {
           this.state.list.map((item,index)=>{
             return <li key={index}> {item} </li>
           })
         }
       </ul>
     </div>
   )
 }
}
export default TodoList;



https://img4.mukewang.com/5ce3c43500017c0407890710.jpg

提问者:Glin 2019-05-21 17:26

1个回答

  • 慕前端0065153
    2019-05-23 11:29

    第12行

    this.state.list

    添加展开运算符

    ...this.state.list