Vue3中Swiper11+自制按钮（button）实现前后页切换

        我最近在做一个Vue3的轮播效果，引入了swiper库。设计过程中到处找怎么调用切换函数，csdn都快翻烂了，很多都是vue2或者swiper早期版本（甚至还在使用 .swiper-container ）

最后结合了好几篇文章终于找到实现办法：

        目前csdn上的方法，又或者天工等一系列大模型给出的函数调用都是正确的，存在的问题是不能正确绑定已存在的swiper。所以给出的解决办法就是用swiper自己的api绑定

<swiper
  ref="swiperRef"
  :modules="modules"
  :options="swiperOptions"
  navigation


  @swiper="bindSwiper"    // 这个地方用@swpier传出一个swiper实例，利用一个函数绑定                
                             到一个形参上。
  >
  <swiper-slide>slide1</swiper-slide>
  <swiper-slide>slide1</swiper-slide>

</swiper>

        在js代码中用一个函数绑定

let mySwiper = reactive([])    // 记得引入reactive
const bindSwiper = (swiper:any) => {
    mySwiper = swiper
}

        定义button再绑定函数

<button
    @click="mySwiper.slidePrev()"    //记得函数的正确形式是slidePrev() / slideNext() 不要写反
> 上一张
</button>