Tengo 6 menús desplegables en la barra lateral.

cuando hago clic en el título, se mostrará el submenú.

Puedo manejar eso con cada función onClick.

me gusta

 const [state, setState] = useState({ one: false, two: false, three: false, four: false, five: false, six: false, }); const oneHandler = (e) => { e.preventDefault(); setState({ ...state, one: !state.one }); } const twoHandler = (e) => { e.preventDefault(); setState({ ...state, two: !state.two }); }

y a cambio

 <div onClick={oneHandler}>First</div> {state.one ? ( <div>Something</div> ):( "" )} <div onClick={twoHandler}>Second</div> {state.two ? ( <div>Something</div> ):( "" )} ...repeat

funciona, pero creo que los códigos son malos.

Entonces, traté de hacer eso usando un evento onClick.

me gusta

 const clickHandler = (value) => { setState({...state, value: !state.value}); }; ... <div onClick={()=> oneHandler(one)}>First</div>

pero en la consola, solo muestra falso.

Solo quiero dejarlo claro y en breve

¿Me pueden recomendar algún otro método?