How to fix ‘Static HTML elements with event handlers require a role.’ warning in React?

Sometimes, we want to fix ‘Static HTML elements with event handlers require a role.’ warning in React.

In this article, we’ll look at how to fix ‘Static HTML elements with event handlers require a role.’ warning in React.

How to fix ‘Static HTML elements with event handlers require a role.’ warning in React?

To fix ‘Static HTML elements with event handlers require a role.’ warning in React, we should set the role attribute of the a element.

For instance, we write:

import React from "react";

export default function App() {
  return (
    <div>
      <a role="button" onClick={() => alert("hello")}>
        hello
      </a>
    </div>
  );
}

to set the role attribute of the a element to button.

Conclusion

To fix ‘Static HTML elements with event handlers require a role.’ warning in React, we should set the role attribute of the a element.