在React中实现的待办事项列表不起作用

时间:2019-06-12 18:51:25

标签: javascript reactjs

我正在尝试在React中实现待办事项列表。它只是一个基本的应用程序,可让您将元素添加到有序列表中。当我在输入框中输入内容时,屏幕什么都没有显示,并且反应了应用程序的崩溃状态<​​/ p>

  super()
        this.state={
            todos : []
        }

   elex(event){
        if (event.key==="Enter"){
            const Lex=<List key= {event.target.value} text={event.target.value} />
            this.setState((previous) =>{
                const Lex1=[...previous]
                Lex1.push(Lex)
                return {todos:Lex1}
            })
        }

     <div>
        const change=this.state.todos
        <h1>Hello There</h1>
          <form>
              <input 
               type="text" 
               placeholder="What to remind" value={this.state.val}
               onKeyPress={this.elex}/>
            </form>
            <ul>   
                <h2>{change}</h2>
            </ul>
        </div>

我将状态存储为包含列表组件的数组。调用事件处理程序时,我试图将一个列表组件推入数组中并在render函数中显示该数组。但是,当我写点东西并按回车键时,屏幕变黑

1 个答案:

答案 0 :(得分:0)

添加新的处理程序和待办事项状态变量

var cur_date = new Date('7/31/2018') ;
var last_row_cur = sales_sheet.getRange(1,1,20,10).getCell(index+1,10).getValue();        
var date_array = sales_sheet.getRange(index,9,last_row_cur,1).getValues()[1]; 
var date_index = date_array.map(function(e) {return e[0]}).indexOf(cur_date);

在输入事件时,将待办事项推入待办事项数组

handleChange = (e) => {
this.setState({todo:e.target.value})
}

如下更改输入标签:

//on enter event

this.setState({todos:[...this.state.todos,this.state.todo]})