slider - Ionic 4 vue - 获取幻灯片索引
问题描述
在 ionic/vue 中,我无法弄清楚如何获取幻灯片索引。getActiveIndex
甚至没有触发,它在文档中,但不清楚如何使用它。ionSlideDidChange
触发,但我看不到与活动幻灯片的索引相关的任何内容。了解哪个滑块处于活动状态的最佳方法是什么?
<ion-slides pager="true" @ionSlideDidChange="ionSlideDidChange" @getActiveIndex="getActiveIndex($event)" :options="slideOptions">
<ion-slide v-for="item in paymentAccounts" :key="item.code">
<div class="account-info">
<div class="account-name">
{{ item.label }}
<br />
R {{ item.balance }}
</div>
<div class="account-footer">
<ion-grid>
<ion-row>
<ion-col class="moneyInOut-label">Money-In</ion-col>
<ion-col class="moneyInOut-label">Money-Out</ion-col>
</ion-row>
<ion-row>
<ion-col class="moneyInOut-amount">{{ item.moneyIn }}</ion-col>
<ion-col class="moneyInOut-amount">{{ item.moneyOut }}</ion-col>
</ion-row>
</ion-grid>
</div>
</div>
</ion-slide>
</ion-slides>
JS:
methods: {
getActiveIndex(r) {
console.log("r", r)
},
ionSlideDidChange(e) {
console.log("e",e)
},
}
解决方案
我认为你可以做这样的事情(至少,它对我有用):
ionSlideDidChange(e) {
e.target.getActiveIndex().then(i => {
this.activeIndex = i;
});
}
希望能帮助到你,
推荐阅读
- elasticsearch - 如何在elasticsearch的搜索结果中获取搜索字符串的开始偏移量和结束偏移量
- python - 可视化 Python 函数流(例如树或概念图)
- sql - 了解 DateTime 列上的 SQL 索引
- sql - 如何将日期和时间维度合并到 DateTime?
- azure - Azure Databricks 作业的 DevOps
- c++ - 为什么用 std::thread 调用复制构造函数 3 次?
- ruby-on-rails - 如何将标头注入 OmniAuth 模拟测试
- android - MaterialShapeDrawable 使我的 CardView 在 API 28 及更低版本上不可见
- jquery - Flask 响应式闪存消息
- image - Tkinter 无法删除图像线