score:0

Accepted answer

one problem i see is that you are not passing a function reference in onclick, but doing a function call instead:

<div classname="m-toggle" onclick={togglemenu()}>

either remove the parentheses after togglemenu:

<div classname="m-toggle" onclick={togglemenu}>

or pass it as an inline arrow function:

<div classname="m-toggle" onclick={() => togglemenu()}>

score:0

you are calling the togglemenu() method during component render which you shouldn't do. so when your component tries to render, it calls togglemenu method and returns null for m-toggle query selector. you can either bind function reference or use arrow function.

<div classname="m-toggle" onclick={togglemenu}>

or

<div classname="m-toggle" onclick={() => togglemenu()}>

score:0

several problems:

  1. react onclick expects a function but you are invoking togglemenu instead. it should be onclick={togglemenu} or onclick={()=>togglemenu()}
  2. you should be managing the classname using state instead of using document.queryselector() and modifying the element yourself.

Related Query

More Query from same tag