0

在 React/BlueprintJS 应用程序中，我有一个TagInput。单击时，我需要访问任何标签的字符串值。为简单起见，假设我只需要console.log(value).

我似乎无法在回调中找到标签的值。根据文档，我相信我需要在内部传递一个 onClick 函数tagProps。但是，我尝试过的任何方法似乎都没有返回字符串值。

我在这里创建了一个基本示例，单击任何标签后在控制台中查看错误：

https://codesandbox.io/s/blueprint-sandbox-7jsb3?fontsize=14

Warning: This synthetic event is reused for performance reasons. If you're seeing this, you're accessing the property `nativeEvent` on a released/nullified synthetic event. This is set to null. If you must keep the original synthetic event around, use event.persist().

我将非常感谢朝着正确的方向轻推，非常感谢。

4

1 回答 1

2

我认为警告本身是不言自明的。

React 有一个合成事件池，这意味着它将一个事件分配给一个处理程序，并在处理程序调用它之后将该事件释放回池中。

const handleTagClick = x => console.log(x);

在上面的代码x中，只有在你显示在屏幕上synthetic event之后，它会被取消并释放到事件池中。TagInput

因此，当您尝试单击时，您会收到警告。消除此警告的简单方法是打印currentTarget。

const handleTagClick = x => console.log(x.currentTarget.innerText);

上面的代码将打印被点击的确切目标。

另一种方法是使用event.persist(),

const handleTagClick = x => {
  x.persist();
  console.log(x.currentTarget.innerText);
}

但我认为在你的情况下它会很慢，所以不要使用它。

阅读有关合成事件的更多信息。

演示

于 2019-09-20T02:29:53.453 回答