Javascript 方向改变时如何更新react swiper？

当我在平板电脑上更改方向时，滑块会断开（显示1个断开的滑块）。预期行为（两张幻灯片纵向宽度为50%）。我尝试使用ref.current.swiper.update（）进行修复，但不起作用

const ref = useRef()
const handleResize = () => {
  ref?.current.swiper.update()
}

useEventListener('resize', handleResize)

<Swiper
  loop
  watchOverflow
  ref={ref}
  className="apartment-swiper"
  breakpoints={{
    768: {
      slidesPerView: 'auto',
    },
    1280: {
      slidesPerView: 1,
    },
  }}
>
  {photo?.map((item, index) => (
    <SwiperSlide className="swiper-slide" key={index}>
      <img className="swiper-slide" src={item.url} alt="slide" />
    </SwiperSlide>
  ))}
</Swiper>

const ref=useRef（）
常量handleResize=（）=>{
ref？.current.swiper.update（）
}
useEventListener（'resize'，HandlerResize）
{photo？.map（（项目，索引）=>(
))}

尝试添加

updateOnWindowResize

或

observer

属性

<Swiper
 loop
 watchOverflow
 observer={'true'}
 className="apartment-swiper"
 breakpoints={{
   768: {
     slidesPerView: 'auto',
   },
   1280: {
     slidesPerView: 1,
   },
 }}
>
 {photo?.map((item, index) => (
   <SwiperSlide className="swiper-slide" key={index}>
     <img className="swiper-slide" src={item.url} alt="slide" />
   </SwiperSlide>
 ))}
</Swiper>

{photo？.map（（项目，索引）=>(
))}