+-
vue 动态修改 swiper 属性失效
export default {
  data() {
    return {
      mySwiper
    };
  },
  mounted() {
    this.mySwiper = new Swiper(".swiper-container-slide", {
      noSwipingClass: "stop-swiping",
      pagination: {
        el: ".swiper-pagination",
        clickable: false,
        renderBullet: function(index, className) {
          return '<span class="' + className + '">' + (index + 1) + "</span>";
        }
      },
      navigation: {
        prevEl: ".swiper-button-prev",
        nextEl: ".swiper-button-next"
      },
      on: {
        reachEnd: () => {
          this.mySwiper.params.pagination.clickable = true; // 对 clickable 属性进行了修改,但失效
          console.log("到了最后一个slide");
        }
      }
    });
  }
};

我的预期效果是默认分页器无法点击,但当滚动到最后一页的时候,分页器方开启点击,经过如下尝试均以失败告终:

尝试通过官方api this.mySwiper.params.pagination.clickable 方法,失效; 尝试通过直接修改 data 方法,失效; 尝试通过 watch 监视修改方法,失效;

还望指点,谢谢!