"The element button has an implicit role of button. Defining this explicitly is redundant and should be avoided.eslintjsx-a11y/no-redundant-roles"
I am getting this warning message whenever I am trying to use <button></button>
tag in my react app. Can anyone explain it a bit more with proper reason?
(My Code is:)
<button onClick={() => signInWithGoogle()} className="px-7 py-3 text-white font-medium text-sm leading-snug uppercase rounded shadow-md hover:shadow-lg focus:shadow-lg focus:outline-none focus:ring-0 active:shadow-lg transition duration-150 ease-in-out w-full flex justify-center items-center mb-3" style={{ "backgroundColor": "#3b5998" }} href="#!" role="button" data-mdb-ripple="true" data-mdb-ripple-color="light">
{/* <!-- Google --> */}
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 320 512"
className="w-3.5 h-3.5 mr-2">
<path
fill="currentColor"
d="M488 261.8C488 403.3 391.1 504 248 504 110.8 504 0 393.2 0 256S110.8 8 248 8c66.8 0 123 24.5 166.3 64.9l-67.5 64.9C258.5 52.6 94.3 116.6 94.3 256c0 86.5 69.1 156.6 153.7 156.6 98.2 0 135-70.4 140.8-106.9H248v-85.3h236.1c2.3 12.7 3.9 24.9 3.9 41.4z"
/></svg>With Google</button>
[I have added the code Screnter image description here
(The message I am getting is:) "The element button has an implicit role of button. Defining this explicitly is redundant and should be avoided.eslintjsx-a11y/no-redundant-roles"
How many English words
do you know?
do you know?
Test your English vocabulary size, and measure
how many words do you know
Online Test
how many words do you know
Powered by Examplum