我不确定是否要采用最佳方法,但是我试图在onMouseOver事件处理程序中访问React组件的参数。
事件处理程序:
handleTabHover = event => {
this.setState({ indicatorColor: event });
};
反应成分:
<LinkTab
label="Dashboard"
to="/"
indicatorColor="gray"
onMouseOver={this.handleTabHover}
onFocus={this.handleTabHover}
/>
基本上,我希望handleTabHover函数中的event
是LinkTab
组件,然后我可以访问它的“ indicatorColor”参数来设置类indicatorColor
的状态,但是事实并非如此。我是React和ES6语法的新手,所以我确定我缺少事件处理程序参数如何工作的基础知识。
答案 0 :(得分:1)
基本上,我希望handleTabHover函数中的“事件”是“ LinkTab”组件,然后我可以访问它的“ indicatorColor”参数来设置类“ indicatorColor”的状态,但事实并非如此。 / p>
是的,你不能那样做。
正确的方法是
<LinkTab
label="Dashboard"
to="/"
indicatorColor={Colors.Deloitte.Primary.coolGray2}
onMouseOver={() => this.handleTabHover(Colors.Deloitte.Primary.coolGray2)}
onFocus={this.handleTabHover}
/>
在您的处理程序中将会
handleTabHover = indicatorColor => {
this.setState({ indicatorColor });
};
您可以在此处阅读更多内容。 https://reactjs.org/docs/faq-functions.html#how-do-i-pass-a-parameter-to-an-event-handler-or-callback