在我的项目中,我们有这样几行代码:
<span
onClick={this.toggleEditing}
>
{this.state.value}
</span>
不用说,它会在 eslint 中产生错误消息“可见的非交互元素不应具有鼠标或键盘事件监听器 jsx-a11y/no-static-element-interactions”。但我不知道解决这种情况的最佳方法是什么,我们是否应该将其更改为按钮并将样式更改为看起来像一个跨度。我对这个问题真的没有太多经验。
最佳答案
查看文档,它精美地告诉您该怎么做。
https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/no-static-element-interactions.md#how-do-i-resolve-this-error
对于您的情况,解决方法是添加 role="button"
<span onClick={this.toggleEditing} role="button">
{this.state.value}
</span>
关于reactjs - jsx-a11y/无静态元素交互 : how to make span clickable,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43404785/