3

以下代码片段来自一个简单的待办事项列表,该列表将信息存储在本地 EOS 区块链上,并具有基于 ReactJS 构建的前端 Web 界面。问题与 ReactJS 有关,特别是事件处理程序代码片段

saveTodo(e) {
  e.preventDefault();
  this.props.onSubmit(this.state.description)
  this.setState({ description: "" })
}

完整的程序可以在这里找到... https://github.com/eosasia/eos-todo/blob/master/frontend/src/index.jsx

在事件处理程序saveTodo(e)的主体中,有一行 this.props.onSubmit(this.state.description)。我想知道这里到底发生了什么?

我是 ReactJS 的新手,它看起来上面的代码行以某种方式通过调用内置函数onSubmit()来设置属性(props),并使用从状态对象中检索到的参数。这个对吗?我看不到onSubmit()是如何在这段代码中的任何地方分配给道具的,但不知何故我们能够像这样使用它:this.props。onSubmit(this.state.description) .... 这里发生了什么?

非常感谢你。

PS请原谅术语。我不确定“事件处理程序”或“事件侦听器”是否是正确的词。

4

1 回答 1

3

TodoForm 组件有一个属性“onSubmit”。

该行只是调用此属性(由其父级传递给它)并传入描述(取自 TodoForm 的状态)。

例如:

<TodoForm onSubmit={(description) => alert(description)} />

在此处阅读有关 react 中的道具的更多信息。

于 2018-06-14T15:41:31.390 回答