How to fix bug with two-way controll swiper in reactjs

问题

So, I have two swipers with two-way controlls:

function GroupSchedule({
  setModalIsOpen,
  setModalContent,
  isFetched
}) {

  const [thumbsSwiper, setThumbsSwiper] = useState(null);
  const [lessonsSwiper, setLessonsSwiper] = useState(null);

  return (
    <>
      <TopBar setModalIsOpen={setModalIsOpen} />
      <Swiper
        slidesPerView={4}
        centeredSlides
        onSwiper={setThumbsSwiper}
        controller={{ control: lessonsSwiper }}
      >
      {...slides1}
      </Swiper>
      {
        isFetched ?
          <Loader />
          :
          <Swiper
            spaceBetween={5}
            slidesPerView={1}
            onSwiper={setLessonsSwiper}
            controller={{ control: thumbsSwiper }}
          >
            {...slides2}
          </Swiper>
       }
    </>
  )
}

First swiper should be static. When I need to show loader, i get error: The above error occurred in the component: ... and controller.js:45 Uncaught TypeError: Cannot read property '1' of undefined: ... I try to set swiper controller in undefined before fetching, it helps but two-way controll is missed, I dont know why controller of static swiper doesn`t set when component re-render...So I need help.

来源：https://stackoverflow.com/questions/63928809/how-to-fix-bug-with-two-way-controll-swiper-in-reactjs