uniapp 相关的swiper的一些注意事项

server/2024/11/24 23:54:16/

先推荐一个一个对标pc端swiper的uniapp版本 zebra-swiper 缺点是自定义分页器不是很好处理 不知道怎么弄

优点:可以进行高度自适应 (这个uniapp原生swiper没有 只能动态修改 采用js 或者只有几种固定高度时采用变量修改)

<swiperref="lifeMiddleSwiper":style="`margin-bottom:24rpx;height:${!middleServiceSwiper ? '165rpx' : '405rpx'};transition:height cubic-bezier(0.45, 0, 0.55, 1) .6s;`"v-if="middleService.length > 0"indicator-dots@change="handleChangeSwiper"><swiper-item v-for="(_, index) in zSwiperItemPage" :key="index"><view class="life-swiper-page"><viewclass="middle-nav-item"v-for="item in lifemiddleService(index)":key="item.id"@click="toUrl(item.url)"><image mode="aspectFill" :src="item.icon" class="middle-nav-item-icon" /><view class="middle-nav-item-title">{{ item.title }}</view></view></view></swiper-item></swiper>//我这里就是采用的原生 因为分页器的缘故,然后我只有2种高度的情况 所以就使用了变量修改高度 
// 原生swiper的分页器
:deep(.uni-swiper-dots-horizontal) {border-radius: 20rpx;overflow: hidden !important;height: 4rpx !important;.uni-swiper-dot {margin-right: 0 !important;height: 4rpx !important;width: 20rpx !important;border-radius: 0 !important;}
}


http://www.ppmy.cn/server/144660.html

相关文章

【U盘车载音乐】某宝198的3068首车载专用音乐合集【高音质】24G

「【U盘车载音乐】某宝198的3068首车载专用音乐合集【高音质】24G」 复制下方口令&#xff0c;打开最新版「夸克APP」即可获取保存&#xff08;防止和谐&#xff01;&#xff01;&#xff01;&#xff09; 口令&#xff1a; 动作懿范鉴真渡多好备用口令&#xff1a; /~19dc35…

微信小程序自定义图片预览操作按钮(解决api预览时不能删除提交服务器等自定义操作)

概述&#xff1a; 本人在做图片预览的时候&#xff0c;希望能够根据预览的情况&#xff0c;实时删除操作。 微信小程序提供的api函数&#xff1a;wx.previewImage&#xff0c;官方说明&#xff1a;https://developers.weixin.qq.com/miniprogram/dev/api/media/image/wx.previ…

九、FOC原理详解

1、FOC简介 FOC&#xff08;field-oriented control&#xff09;为磁场定向控制&#xff0c;又称为矢量控制&#xff08;vectorcontrol&#xff09;&#xff0c;是目前无刷直流电机&#xff08;BLDC&#xff09;和永磁同步电机&#xff08;PMSM&#xff09;高效控制的最佳选择…

初始Python篇(4)—— 元组、字典

找往期文章包括但不限于本期文章中不懂的知识点&#xff1a; 个人主页&#xff1a;我要学编程(ಥ_ಥ)-CSDN博客 所属专栏&#xff1a; Python 目录 元组 相关概念 元组的创建与删除 元组的遍历 元组生成式 字典 相关概念 字典的创建与删除 字典的遍历与访问 字典…

「Mac玩转仓颉内测版29」基础篇9 - 数组类型详解

本篇将介绍 Cangjie 中的数组类型&#xff0c;包括数组的定义、创建、访问、常见操作以及在数据管理中的应用&#xff0c;帮助开发者熟练掌握数组的使用。 关键词 数组类型定义数组创建数组访问数组操作应用场景 一、数组类型概述 在 Cangjie 中&#xff0c;数组是一种用于存…

【山大909算法题】2014-T2

文章目录 1.原题2.算法思想3.关键代码4.完整代码5.运行结果 1.原题 二叉树采用二叉链表存储结构&#xff0c;设计算法&#xff0c;判断二叉树是否为满二叉树。叙述算法思想并给出算法实现。 2.算法思想 通过一次遍历&#xff0c;得到结点个数和树的高度。用结点个数和树的高…

Flink Standalone集群模式安装部署全攻略

Flink Standalone集群模式安装部署全攻略 一、引言 Flink作为一款强大的分布式流处理和批处理框架&#xff0c;在大数据领域有着广泛的应用。本文将详细介绍Flink Standalone集群模式的安装部署过程&#xff0c;帮助大家快速搭建起开发测试环境。 二、安装前准备 首先&…

Django:从入门到精通

一、Django背景 Django是一个由Python编写的高级Web应用框架&#xff0c;以其简洁性、安全性和高效性而闻名。Django最初由Adrian Holovaty和Simon Willison于2003年开发&#xff0c;旨在简化Web应用的开发过程。作为一个开放源代码项目&#xff0c;Django迅速吸引了大量的开发…