单击子元素时反应获取父元素的状态/数据

Question

我有一个父元素li的构造，其中包含一个链接和一个超棒的i 。 当我单击i我需要将父项的标题（从redux状态）传递给该函数。

1. 我需要以某种方式遍历DOM树来获取它吗？
2. 我对事件处理程序的设置是否有所不同？

3. 单击子元素时，如何访问父状态？

    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

1. 不，您不需要遍历任何东西，可以直接在onClick中传递它

2. 是的，您需要像这样更改onClick

    onClick={() => this.deleteBase(base.title)} 

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

3. 您的第三点没有多大意义，因为您位于同一组件中，因此只有一个局部状态，父元素和子元素都可以访问。 但这对您没有用，因为您尝试访问的标题不是处于本地状态也不是redux状态，而仅仅是base对象本身的属性。