Tengo un formulario que tiene algunos campos de texto. Si tiene un rol determinado, debería poder hacer clic en los campos y escribir, pero si no tiene el rol de administrador, todos deberían estar deshabilitados. ¿Cómo deshabilitaría todos los campos de texto dada esta situación? Aquí está mi código. Soy bastante nuevo para reaccionar y cualquier ayuda sería apreciada.

Podría hacer algo como esto, pero hay una manera más fácil con menos repetición, ya que esta forma definitivamente se volverá más grande y más compleja y debería poder deshabilitar todo si no se le asigna el rol correcto.

 export default function BasicTextFields() { const classes = useStyles(); const hasRole = authService.verifyRole(role.admin) return ( {hasRole ? ( <form className={classes.root} noValidate autoComplete="off"> <TextField id="standard-basic" label="Title" /> <TextField id="filled-basic" label="Description" /> <TextField id="outlined-basic" label="Data" variant="outlined" /> </form> ); ) : ( <form className={classes.root} noValidate autoComplete="off"> <TextField id="standard-basic" label="Title" disabled/> <TextField id="filled-basic" label="Description" disabled/> <TextField id="outlined-basic" label="Data" variant="outlined" disabled/> </form> }