React 如何从 event.currentTarget 获取物品道具

Question

React 是否有一种从列表项中获取 this.props.values 的简洁方法？

我基本上想获取当前项目道具，以便我可以用数据填充模式对话框。按照下面的功能，我指定的自定义道具 'id' 是可以访问的，但我真的很想做这样的事情并拥有所有道具

event.currentTarget.this.props.note

处理程序

  clicker(event){
    console.log('clicking the clicker');
    console.log(event.currentTarget.id);

    this.setState({isEdit: true});
    console.log(this.state.isEdit);
  }

查看

<div id={this.props.id} onClick={this.clicker} className="aui-item page-card off-track notecards">
       <div className="project-details">
          <div className="card-container">
              <div className="left">
                  <h6>Title</h6>
                  <span>{this.props.note.content}</span>

                  <h6 className="compact">Last status report</h6>
                  <span>{this.props.note.updatedAt}</span>
              </div>

              <div className="right">
                <span>something</span>
              </div>
          </div>

      </div>
    </div>

Answer 1

您可以直接访问clicker中的道具

clicker(event){
    console.log('clicking the clicker');
    console.log(this.props.id);

    this.setState({isEdit: true});
    console.log(this.state.isEdit);
  }

Answer 2

在这种情况下，最好创建单独的组件。我认为没有必要创造巨大的观点。

所以，你的组件应该是这样的：

function Item({
  id,
  updatedAt,
  content,
  onClick,
}) {
  // We should pass `id` variable to `onClick` handler.
  return (
    <div onClick={() => onClick(id)} className="aui-item page-card off-track notecards">
      <div className="project-details">
        <div className="card-container">
          <div className="left">
          <h6>Title</h6>
          <span>{content}</span>
          <h6 className="compact">Last status report</h6>
          <span>{updatedAt}</span>
        </div>
        <div className="right">
          <span>something</span>
          </div>
        </div>
      </div>
    </div>
  );
}

或者，如果您不想使用单独的组件，您可以从点击器事件处理程序访问 this.props 变量：

clicker(event){
   // this.props are accesible here.
   this.setState({isEdit: true});
}

React 如何从 event.currentTarget 获取物品道具

React how to get item props from event.currentTarget

javascript

reactjs

react-jsx