how to get button value to another react component?

Question

so i have a form component having button array, though i used icons in it with value attribute. just like below.

<button value={'admin'} onClick={(e)=> handleClick(e.target.value)}>
      <FaUserSecret classname="text-lg" />
</button>

in handleClick function e.target.value is returning icon instead of admin.

Thanks in advance .

I tried to pass e as parametter and use its value in function but still same.

Answer 1

You can use e.currentTarget.getAttribute("value") method to get the admin value assigned to the button.

CodeSandbox code reference

Difference b/w e.target and e.currentTarget - difference-between-e-target-and-e-currenttarget

Answer 2

Can you please elaborate or share more code with us. Cause I tried your given code and it's working fine. I am getting 'admin' as the output.

    <div className='App'>
      <button value={'admin'} onClick={(e)=> console.log(e.target.value)}>
     Click
      </button>
    </div>

Answer 3

Try this:

<button value={'admin'} onClick={e => handleClick(e.target.value)}>
      <FaUserSecret classname="text-lg" />
</button>

You're not supposed to use parenthesis around "e".