Question

我的reactjs样式组件包含以下代码：

<a styling="link" onClick={() => this.gotoLink()}>
  <SomeComponent /> 
</a>

这很好，但是随行人员抱怨：

Static HTML elements with event handlers require a role.

如何解决此错误？

Answer 1

前面的答案确实给出了具体的例子，我缺少的是一个roles的列表。
如果有人正在寻找其他角色，则会列出一个部分列表here。
缺少 role 的一个例子是我需要的 tab。

Answer 2

您需要在标签中添加角色道具以避免此警告，例如按钮

<a role = "button" styling="link" onClick={() => this.gotoLink()}>
  <SomeComponent /> 
</a>

我想这是因为锚标记中缺少HREF道具（不确定）

Answer 3

就我而言，我使用了aria-hidden =“ true”，因此我可以提交。

<i className="pwdicon" onClick={togglePasswordVisiblity} >

After I updated like below,

<i className="pwdicon" onClick={togglePasswordVisiblity} aria-hidden="true" >

My problem is resolved

参考链接：Android Studio - Android Emulator Wifi Connected with No Internet

Answer 4

您需要显式设置角色。因此，尝试下一个代码：

<a role="button" styling="link" onClick={this.gotoLink}>
  <SomeComponent /> 
</a>

此外，如您所见，我已经通过替换常规声明中的arrow函数来修改onClick处理程序。这样可以减少烦人且昂贵的计算。

如何修复“带有事件处理程序的静态HTML元素需要角色”？

4 个答案: