¿Cómo puedo reducir el raiting para poder calificar solo una vez por navegador?
Necesito validar el componente de calificación en React, donde el cliente puede calificar solo una vez por navegador.
Aquí hay un ejemplo del componente de calificación:
export default function App() { const [value, setValue] = React.useState(0); return ( <div> <Box component="fieldset" mb={3} borderColor="transparent"> <Typography component="legend">Rate</Typography> <Rating name="pristine" value={value} onClick={(e) => setValue(e.target.value)} /> </Box> </div> ); }Aquí está el enlace de la caja de arena del enlace de la caja de arena del componente
Una posible solución que podría pensar es usar localStorage
Para cada usuario, que ya tiene una tarifa, almacena un valor booleano en el almacenamiento local.
Luego, la próxima vez, se validará primero.
Algo como esto:
export default function App() { const [value, setValue] = React.useState(0); const hasRated = localStorage.getItem("hasRated"); const handleRate = (e) => { setValue(e.target.value); localStorage.setItem("hasRated", true); }; return ( <div> <Box component="fieldset" mb={3} borderColor="transparent"> <Typography component="legend">Rate</Typography> <Rating disabled={hasRated} name="pristine" value={value} onClick={handleRate} /> </Box> </div> ); }Tenga en cuenta que este es solo un ejemplo demostrado, por lo que supone que necesitará alguna mejora en función de sus necesidades.
Ejemplo de caja de seguridad: