从 'react' 导入 React, { Component } 从 '../Listview/ListView' 导入 ListView 从'../tableview/TableView' 导入 TableView 从“reactstrap”导入 {Modal,ModalBody,ModalHeader} 从'../controllers' 导入控制器 从 '../create-todo-form/TodoForm' 导入 TodoForm 从'shortid'导入shortid class Todos 扩展组件 {
state = {
todos: [
{
id: 'dhdkjashdk',
text: 'main todo text',
description: 'simple description',
time: new Date(),
isComplete: false,
isSelect: false
},
{
id: 'dhdkjarershdk',
text: 'not main todo text',
description: 'simple descript',
time: new Date(),
isComplete: false,
isSelect: false
}
],
isOpenTodo: false,
term:''
};
toggleSelect = (todoId) => {
}
toggleComplete = (todoId) => {
}
handleSearch = () => {
}
toggleForm = () => {
this.setState({
isOpenTodo: !this.state.isOpenTodo
})
}
createTodo = (todo) => {
}
render() {
return (
<div>
<h1 className='display-4 mb-5 text-center'>Stack todos</h1>
<Controller
term={this.state.term}
toggleForm={this.toggleForm}
handleSearch={this.handleSearch}
/>
<div>
<ListView
todos = {this.state.todos}
toggleSelect={this.toggleSelect}
toggleComplete = {this.toggleComplete}
/>
</div>
<div>
<TableView
todos= {this.state.todos}
toggleSelect={this.toggleSelect}
toggleComplete={this.toggleComplete}
/>
</div>
<Modal
isOpen={this.state.isOpenTodo}
toggle={this.toggleForm}
>
<ModalHeader toggle={this.toggleForm}>
create new todo Item
</ModalHeader>
<ModalBody>
<TodoForm createTodo = {this.createTodo}/>
</ModalBody>
</Modal>
</div>
)
}
}
导出默认 Todos