首页 > 其他分享 >uni中使用轮播图

uni中使用轮播图

时间:2023-04-17 17:46:04浏览次数:32  
标签:轮播 item 使用 uni 弹幕 css

最近在写一个类似于滚动弹幕,使用纯css,效果有点假,不太真实

因此想起来uni中有轮播图,可以直接使用

 <swiper class="swiper" style="height:90rpx;" circular vertical="true"     :autoplay="true" :interval="3000" :duration="1000">
	<swiper-item v-for="(item,index) in list" :key="index">
		<view class="swiper-item">
                      <view class="tips tips1"  >
                             <view>{{item}}</view>
                      </view>
                </view>
	</swiper-item>
</swiper>

  根据以上代码即可实现轮播图的使用,我这边是只使用了文字版如有需要图片的,可以根据自己的需求进行写样式。

标签:轮播,item,使用,uni,弹幕,css
From: https://www.cnblogs.com/bingchenzhilu/p/17326580.html

相关文章

  • 记录 RedisTemplate.executePipelined 使用问题
    需求,向redis写入2000万个key@Slf4j@Component("job2")publicclassToRedis2implementsIJob{privateAtomicLongcount=newAtomicLong(0);privateLongoldCount=0L;privateList<String>userIdList=newArrayList<>();pri......
  • ansible的docker_container模块使用
    使用docker_container模块创建容器示例:----hosts:myserveripremote_user:root#执行用户gather_facts:false#屏蔽系统信息返回vars:ansible_python_interpreter:/usr/bin/python3#定义ansible使用python3的环境serial:"100%"#更新比列,可以......
  • 手机网站左侧弹出菜单功能-uniapp
    效果图     <template> <viewclass="drawer":class="{moveRight:isActive,moveLeft:isClose}"> <uni-nav-bardarkshadowbackground-color="#007AFF"status-bar:left-icon="left_icon"left-text=......
  • 使用egg-socket.io 搭建socket 服务
    1.后台安装egg-socket.ionpmiegg-socket.io--save开启插件//{app_root}/config/plugin.jsexports.io={enable:true,package:'egg-socket.io',};配置//{app_root}/config/config.${env}.jsexports.io={init:{},//passedtoengine.io......
  • git使用
    今日内容git介绍和安装git使用流程git常用命令git忽略文件git多分支git远程仓库ssh方式连接远程仓库协同开发冲突解决线上分支合并远程仓库回滚1git软件介绍和安装#代码管理软件-git-svn#它们能做的事情--->用来做代码管理[文件......
  • 识别验证码的使用
    muggle_ocr链接:https://pan.baidu.com/s/1w-sp-BQ1BCgOXYKRSo5nZg提取码:mubp下载完成之后,直接使用pipinstall语句即可:pipinstallmuggle-ocr-1.0.3.tar.gz-ihttps://pypi.douban.com/simplepip设定特定版本python-mpipinstallpip==20.2.4、ddddocr库的安装与......
  • FinClip 与 uniapp:轻应用平台与前端开发框架
    原文地址juejin.cnFinClip背后的产品经理发现很多开发者或业务部门的朋友,在刚了解到FinClip的时候,都会好奇FinClip能解决怎样的问题,也会经常将FinClip与uni-app进行对比考虑二者的区别与优劣势。因此在本文中,FinClip的产品经理会和我们深入地探讨FinClip与uni-app之......
  • Visual Studio编译和使用wxWidgets
    一、下载到官网:https://www.wxwidgets.org/官网会引导跳到github:https://github.com/wxWidgets/wxWidgets/releases/tag/v3.2.2github有很多个下载链接,有代码(source)和预编译包(binary),后者又分开发版(dev)和发布版(release)预编译包的VC版本和VS版本对应如下:*vc14x兼容20......
  • 功能不够用?使用C++编写通达信插件及接入Python(二)
    参考:https://zhuanlan.zhihu.com/p/613157262一、准备工作(参考上一篇)安装VS2019 安装pycharm下载 http://help.tdx.com.cn/book.asp《通达信DLL函数编程规范.rar》二、下载python3.x的32位版本,http://www.python.org,随便找个32位版就行了。我准备下载Windowsembeddabl......
  • Dockerfile详细使用、docker私有仓库、dockercompose介绍、dockerpose部署flask+redis
    昨日内容#1容器其他操作1dockerstart容器id2dockerstop容器id3dockerrm容器id4dockerrm`dockerps-aq`#正在运行的容器不能删除5dockerexec容器id命令6dockercp宿主机目录容器id:容器目录#目录要存在7docker......