javascript - 确定切换了哪个切换 - Office UI Fabric - React

Question

我正尝试在我的加载项中使用多个切换按钮，但无法确定切换了哪个。

在大多数情况下，我能够获取切换器的 ID，但如果用户单击切换器内较小的旋钮，我将无法获取切换器的 ID。

在上面的示例中，如果我单击红色箭头指向的切换拇指，我将获得以下输出作为 target.id

我无法确定这是哪个切换开关，也不相信我可以设置切换拇指的 ID。

当用户单击绿色部分中的任意位置时，我会看到以下日志，我可以在其中获取 ID 并执行条件逻辑。

在将此作为 github 上的错误报告之前，我想确保我没有做错什么。我遇到了类似但不是我要找的东西:https://github.com/OfficeDev/office-ui-fabric-react/issues/6753

此代码笔将显示问题: https://codepen.io/rocketlobster5/pen/eYOvGjz

Answer 1

我认为获取事件监听器附加到 currentTarget property 的元素不应该被视为错误应该使用而不是 target。

以下示例演示如何检索切换元素的 id:

private handleChange(ev: React.MouseEvent<HTMLElement>, checked: boolean) {
   console.log(ev.currentTarget["id"]);
}

Modified codepen