Как использовать События в vue-Carousel?

Question

Я бы хотел перемещаться по карусели, используя функции в методах.

Я использую эту vue-carousel

vue-carousel

Они писали в документах о событиях для навигации, но я не знаю, какиспользовать это. Любая ориентация? Спасибо!

Пример:

methods: {
    GoToPage5:function(){
      //use Carousel events here    
    },

Answer 1

:navigate-to="2", кажется, не работает в vue-carousel.

этот код работает.

         this.$refs.carousel.goToPage(2);

Answer 2

Как и с любым другим пользовательским компонентом Vue, вы можете связать прослушивателей событий , используя либо v-on, либо сокращение @:

<carousel @navigation-click="navigationHandler">

, затем в вашей конфигурации Vue,Вы предоставляете метод обработчика:

{
  ...,

  methods: {
    navigationHandler(direction) {
      // direction = "backward" or "forward"
    }
  },

  ...
}

Вы можете использовать то же соглашение для прослушивания любого из пользовательских событий пакета .

---

ОБНОВЛЕНИЕ:

Поскольку вы хотите использовать свойство :navigate-to, вам необходимо сделать следующее:

1. Привязать к свойству правильно - используя кебаб-кейс , а не верблюжий кейс:

<carousel :navigate-to="manualNavigation">

Создайте свойство данных manualNavigation:

{
  data() {
    return {
      ...
      manualNavigation: 5,
      ...
    }
  }
}

Вручную обновите свойство manualNavigation:

{
  ...
  methods: {
    GoToPage5() {
      this.manualNavigation = 5;
    },
  }
}

Теперь, когда вы звоните GoToPage5(), карусель должна отвечать анимацией на 5 слайдов.