如何控制weex的Slider显示第几页。

发布于 2022-09-05 10:20:49 字数 603 浏览 27 评论 0

我使用 weexslider 模块来实现类似 Android 的 ViewPager 滑动功能,这的确是可行的.但是这里我需要加一个导航栏,点击后切换到指定页面就不知道如何去做了。

silder 只在 onchange 方法中的 event 对象属性中有一个 index 值可以获取当前图片的索引,没有提到通过代码切换 slider 页面的方法。

我也查了一下相关问题,在weex怎么实现界面左右滑动切换问题中曾经提到过该问题,但是只是说了有一个 index 值,改变 index 值可以实现页面切换。但是没提到具体做法~

那么……又遇到过类似问题的童鞋吗?求指教~非常感谢~~

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

惟欲睡 2022-09-12 10:20:49

问题已解决,刚才看了下android端的SDK源码~发现slider文档中有3个特性没写出来。

  • showIndicators 控制轮播图指示器显示与否。传入 false 或者 空字符串 则不显示轮播图指示器。
  • value 获取value值,如果为数字,切换 slider 到指定页。
  • index 切换 slider 到指定页(valueindex 功能差不多。)。

注意:这里的三个参数设置默认值没用,都需要 v-bind 绑定,然后改变绑定的值才会变。

具体可以看下SDK源码,源码地址在playground项目中有~(找了好久 - -|)

代码:

<template>
  <div>
    <slider class="slider" interval="3000" :value="val" :index="index" :showIndicators="show">
      <div class="frame" v-for="img in imageList" :key="img.src">
        <image class="image" resize="cover" :src="img.src"></image>
      </div>
      <indicator class="indicator"></indicator>
    </slider>
    <text class="btn" @click="val = 0">toPage0</text>
    <text class="btn" @click="val = 1">toPage1</text>
    <text class="btn" @click="val = 2">toPage2</text>
    <text class="btn" @click="show = 'false'">showIndicators</text>
  </div>
</template>
别低头,皇冠会掉 2022-09-12 10:20:49

官网demo就有slider table

究竟谁懂我的在乎 2022-09-12 10:20:49

楼主有遇到当快速切换时,导航栏的选中名字和slider内的显示区域不一致这个现象吗?
请问,这点怎么解决???
图片描述

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文