Question

我对React，Redux和Routes都很陌生。我正在使用redux store来渲染带有多个Todos的ToDoList。我的目标是通过一些额外的输入创建一个新的ToDo。它必须是一个新Todo，我不想改变原来的Todo。

从列表中选择1 ToDo时，会显示一个输入框。一个新的待办事项包括来自所选Todo的输入和道具。在创建了我的New Todo之后，我希望在创建了我的New Todo的情况下将其路由到另一个页面（它必须在另一个页面中）。

当前阶段：路线已经成形。我也已经展示了Todos。我不知道如何将选定的Todo +（输入）传递到下一页。

TodoList.js

@connect((store) => {
    return {
        todos: store.todos.todos,
    }
})

class TodoList extends React.Component {
render() {    
    const todos = todos.map(todo => <Todo key={todo.id} name={todo.text} id={todo.id} />)

return (
    <div>
        {todos}
    </div>
}

ToDo.js

class ToDo extends Component {

handleSubmit(event) {
    event.preventDefault();
    // Get <input /> value
    // Get props

    // Create a New Todo with selected props and <input /> value for my store.
    // *Route to new page* that will display props and <input /> from store. 
}
render(){
    {this.props.name}
    <input />
    <button className="btn " onClick={this.handleSubmit.bind(this)}>Create</button>
}
}

我的方法是否正确？任何帮助将不胜感激。谢谢你，祝你有个美好的一天。

React-router将数据传递给组件/添加到存储并使用数据路由到新组件

0 个答案: