Визуализация нескольких выбранных компонентов с помощью Swiper с использованием интерфейса «Карта не работает» — Реагирует пользовательский интерфейс

#javascript #reactjs #material-ui #swiperjs

Вопрос:

Я пытаюсь отобразить несколько карт и сохранить их в slides переменной, чтобы я мог поместить эти карты в Свайпер. но компонент Выбора для каждой карты, похоже, не отвечает (невозможно щелкнуть и выпадающее меню, чтобы отобразить компоненты меню). Вот код:

 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) =gt; {  console.log(`value: ${value}`);  setdataShown(value);  };    const slides = ['A', 'B', 'C'].map((e) =gt; {  return (  lt;Cardgt;  {e}  lt;Select label="Label" onChange={handleChange}gt;   lt;MenuItem key={1} value="A"gt;  A  lt;/MenuItemgt;  lt;MenuItem key={2} value="B" disabledgt;  B  lt;/MenuItemgt;  lt;/Selectgt;  lt;/Cardgt;  ); })   return (  lt;Swiper  spaceBetween={50}  slidesPerView={1}  loop  gt;   {slides.map((slide, index) =gt; (  lt;SwiperSlide key={index}gt;{slide}lt;/SwiperSlidegt;  ))}  lt;/Swipergt;  ); }