Estoy tratando de renderizar varias Tarjetas y almacenarlas en la variable de slides para poder poner esas Tarjetas en un Swiper. pero el componente Seleccionar para cada tarjeta parece no responder (no se puede hacer clic y desplegar para mostrar los componentes de MenuItem). Aquí está el código:

 import React, { useState } from 'react'; import { Swiper, SwiperSlide } from 'swiper/react'; import { Card, Select, MenuItem } from '@material-ui/core'; export default function DataSwiper() { const [value, setValue] = useState('A'); const handleChange = (value) => { console.log(`value: ${value}`); setdataShown(value); }; const slides = ['A', 'B', 'C'].map((e) => { return ( <Card> {e} <Select label="Label" onChange={handleChange}> <MenuItem key={1} value="A"> A </MenuItem> <MenuItem key={2} value="B" disabled> B </MenuItem> </Select> </Card> ); }) return ( <Swiper spaceBetween={50} slidesPerView={1} loop > {slides.map((slide, index) => ( <SwiperSlide key={index}>{slide}</SwiperSlide> ))} </Swiper> ); }