uni-app swiper设置显示面板指示点的背景颜色与选中颜色

查看uni-app官网文档找到设置的背景与选中的属性为indicator-color、indicator-active-color，直接如下图所示进行设置，

<swiper class="swiper" style="height:100px;"  :autoplay="true"
:interval="3000" :duration="1000" :vertical="false" :circular="true"
:indicator-dots="true" :indicator-active-color="#ffffff" :indicator-color="rgba(255,0,0,.5)"><swiper-item v-for="item in 3" :key="item"><view class="swiper-item" style="height: 100%;width:100%;border-radius:10px;overflow: hidden;"><image src="/static/uni.png" style="width: 100%;height:100%;"></image></view></swiper-item>
</swiper>

结果报错如下：

原因：这两个属性直接赋值即可生效

<swiper class="swiper" style="height:100px;"  :autoplay="true"
:interval="3000" :duration="1000" :vertical="false" :circular="true"
:indicator-dots="true" indicator-active-color="#FF713F" indicator-color="rgba(255,255,255,1)"><swiper-item v-for="item in 3" :key="item"><view class="swiper-item" style="height: 100%;width:100%;border-radius:10px;overflow: hidden;"><image src="/static/uni.png" style="width: 100%;height:100%;"></image></view></swiper-item>
</swiper>

uni-app swiper设置显示面板指示点的背景颜色与选中颜色相关推荐

Windows 11 / 10 怎样设置火狐浏览器的页面背景为护眼颜色
怎样设置火狐的页面背景为护眼颜色 1. 安装,和配置stylish插件. firfox浏览器地址栏输入about:addons --> 在出现的网页的搜索栏中输入Stylus搜索 --> ...
APP - 一个设置，让微信聊天背景清晰10倍
大家有没有发现: 不管多么高清的大图, 在设置成为微信聊天背景图后都变得有点糊??? 作为眼前容不下糊图的强迫症患者, 打工妹决不允许我的小姐姐变得模糊! 其实会这样是因为微信默认对图片进行 ...
切换 uniapp_万能前端框架uni app初探03：底部导航开发
前言本节我们使用uni app的底部导航功能,点击不同tab会显示不同页面,这个功能在实际项目开发中几乎是必备的. 一.基础知识 1.tabBar 如果应用是一个多 tab 应用,可以通过 tabB ...
uni app map 地图漂浮问题及方案
uni app map 地图漂浮问题及方案文章页有图片导致的问题,图片没加载出来,导致文章内容高度不固定,如果图片没加载出来,高度就是0,如果此时开始加载map,那么map就在那里加载,map原生 ...
uni app 视频播放功能
视频播放功能,需求:编译成纯h5网页,运行在任意容器里,如浏览器.安卓原生和iOS等媒体组件video 首先使用video组件,然后高度需要自己设置 uni.createVideoContext 官 ...
uni app(H5)中软键盘弹出,固定定位绝对定位元素位置发生错乱
一.问题如下最近用uni app写项目,发现H5软键盘弹起,导致我固定定位的按钮被顶了上去,如图二.解决方法 1.让其在输入框获取焦点时隐藏百度了许多,有让输入框获取焦点时让按钮隐藏的方法,失去 ...
uni app 开发微信小程序及上线体验
uni app 开发微信小程序及上线体验项目创建及微信小程序AppId的申请本次开发的是电商类的微信小程序,这里用到的是HBuilderX这个编辑器.之前用的Visual Studio Code ...
uni app使用雷电模拟器进行真机调试
之前我用uni app真机调试时都是连接的自己的手机,每次都插根数据线,感觉不是很喜欢.今天又用真机调试想起来手机模拟器,就下了一个雷电.然后把配置真机调试的步骤分享出来吧. 一.安装手机模拟器在这 ...
uni app push 集成小米
重新设置厂商推送设置后,需要重新制作自定义基座,包括添加和修改厂商推送设置用自定义的基座打包好测试包,安装到手机上. 先测试小米后台是否能推送成功推送后,手机就能接受到消息了再看java代 ...

uni-app swiper设置显示面板指示点的背景颜色与选中颜色

uni-app swiper设置显示面板指示点的背景颜色与选中颜色相关推荐

最新文章

热门文章