在ReactJS的OnClick事件中传递Nav标签的值或名称

Question

我遇到了一个无法解决的愚蠢的小问题，就是如何将值传递给OnClick事件？ 我需要通过它，因为它是菜单中某些值的值，并且我正在使用它们进行处理：

我的onClick函数：

  onClick() {
    this.setState(prevState => ({ childVisible: !prevState.childVisible }));
  }

我的“导航栏”的逻辑是：

   <NavLink
                      onClick={() => this.onClick()}
                      value={"Spain"}
                      to="/other">
                      Spain
                    </NavLink>
       <NavLink
                      onClick={() => this.onClick()}
                      value={"EE.UU"}
                      to="/sidebar">
                      EE.UU
                    </NavLink>

之后，我需要恢复OnClick函数的值（国家（西班牙或EE.UU）的名称）传递。

我了解有很多帖子，但对我不起作用。

谢谢！

Answer 1

你有没有尝试过

   <NavLink
     onClick={() => this.onClick("Spain")}
     value={"Spain"}
     to="/sidebar">
     Spain
   </NavLink>

在您的onClick函数中，您将获得价值

onClick(value) {
 console.log(value); //Spain
}

Answer 2

您可以使用currying，请注意，您可能必须对此进行绑定或使用箭头函数自动绑定适当的this上下文

  onClick(value) {
    // use value how ever you need
    this.setState(prevState => ({ childVisible: !prevState.childVisible }));
  }

  bindValueToClick(value) {
     return function() {this.onClick(value)};
  }

   <NavLink
     onClick={this.bindValueToClick("Spain")}
     value={"Spain"}
     to="/sidebar"
   >
     Spain
   </NavLink>