Estoy atascado, estoy agregando aminación en el formulario en cada clic en el botón de opción, la siguiente pregunta debería deslizarse hacia arriba, pero esto no sucede, el deslizamiento ocurre solo en la primera pregunta.
<CSSTransition classNames="fade" in={expanded} timeout={300} unmountOnExit > <Card variant="outlined" sx={{ bgcolor: "#bea"}} elevation={0}> <CardContent> <form onSubmit= {handleSubmit}> <CardActions> <Button type="submit" color="warning" variant="outlined" className={classes.button} onClick={previousQuestion}> Previous</Button> </CardActions> <FormControl component='fieldset' className={classes.formControl} data-hidden={questions[currentQuestion].number !== currentQuestion[questions[currentQuestion].number]}> <FormLabel component='legend'> {questions[currentQuestion].question} </FormLabel> <FormLabel component='legend'> {questions[currentQuestion].description} </FormLabel> <RadioGroup aria-label='quiz' name='quiz' value={questions[currentQuestion].value} onChange={(e)=> handleRadioChange(questions[currentQuestion].number, e)} sx={{ color: pink[800], '&.Mui-checked': { color: pink[600], }, }}> {options.map((option) => ( <FormControlLabel key={option.score} value={option.score} control={<Radio sx={{ color: pink[800], '&.Mui-checked': { color: pink[600], }, }}/>} label={option.label} /> ))} </RadioGroup> </FormControl> <CardActions> <Button type="submit" variant="outlined" color="primary" className={classes.button} onClick={handleSubmit}> Submit </Button> </CardActions> </form> </CardContent> </Card> </CSSTransition>el css es
.fade-enter { opacity: 0; } .fade-enter.fade-enter-active { opacity: 1; transition: opacity 0.5s ease-in-out 0.3s; } .fade-leave { position: absolute; top: 0; left: 0; width: 100%; opacity: 1; } .fade-leave.fade-leave-active { opacity: 0; transition: opacity 0.5s ease-in-out; }La animación no funciona. Por favor, ayuda para averiguarlo. Quiero que todas las preguntas desaparezcan al hacer clic en el botón de opción. Pero esto ocurre solo en el primero, pero después de eso no hay transición.