当点击 child 元素时反应得到 state/data 的 parent 元素

Question

我有一个 parent 元素 li 的构造，其中包含一个 link 和一个 font-awesome i。当我点击 i 时，我需要将 parent 的标题（从 redux 状态）传递给函数。

我是否需要以某种方式向上遍历 DOM 树来获取它？
事件处理程序的设置是否不同？

如何在单击 child 元素时访问 parent 的状态？

export default class DashContent extends React.Component {
  deleteBase(title) {
    this.props.dispatch(removeBase(title))
  }

  render() {
    const baseList = this.props.bases.map(base => (
      <li key={base.title} className="base">
        <Link to={base.title}>{base.title}</Link>
        <i className="fas fa-times" onClick={title => this.deleteBase(title)} />
      </li>
    ));
  }

  return (
    <ul>
      {baseList}
      <li>
        <AddBase />
      </li>
    </ul>
  )
}

Answer 1

不用遍历什么，直接在onClick中传就可以了
是的，您需要将您的 onClick 更改为这样
```
onClick={() => this.deleteBase(base.title)}
```

现在在您的 deleteBase 函数中，您将标题作为参数传递

你的第三点没有多大意义，因为你在同一个组件中，所以只有 1 个本地状态，parent 元素和 child 元素都可以访问到。但这对您的情况没有用，因为您尝试访问的标题既不在本地状态也不在 redux 状态，而只是 base object 本身的属性。

当点击 child 元素时反应得到 state/data 的 parent 元素

React get state/data of parent element when click on child element

javascript

traversal

reactjs

redux