首页 > 编程语言 >微信小程序校园购物学习笔记

微信小程序校园购物学习笔记

时间:2023-03-06 16:48:47浏览次数:43  
标签:Indicator 滚动 轮播 微信 校园 用户 笔记 是否 swiper

在第二大学远程实习中学习校园购物的学习笔记
1.轮播图
轮播图是在网购页面最常见的效果,可以轮换播放图片,或者由用户手动切换。

使用swiper滑动视图容器进行制作,其中常用属性如下:
Indicator-dots 是否显示轮播图指示点
Indicator-color 轮播图指示点背景色
Indicator-active-color 轮播图指示点颜色
Circular 是否衔接滑动
Autoplay 是否自动播放
Interval 自动切换时间间隔

注意点:swiper中仅能使用swiper-item组件,否则会到出现“未定义行为”的错误。
image

2.导航栏功能
在一个网页中,可以帮助用户快速找到用户所需内容。
使用scroll-view 可滚动视图制作。
常用属性如下:
Scroll-x 是否允许横向滚动
Scroll-y 是否允许纵想滚动
注意点:使用竖向滚动时,需要给scroll-view一个固定高度,通过 WXSS 设置 height。
image

3.搜索框
在网页中输入关键字达到快速查看用户所需内容,这是最常见的。
使用input输入框原生组件制作。
常用属性如下:
Type 输入类型
Placeholder 在输入框为空时的占位
Focus 获取焦点(auto-focus 同作用,即将废弃)
image

标签:Indicator,滚动,轮播,微信,校园,用户,笔记,是否,swiper
From: https://www.cnblogs.com/skystars/p/17184385.html

相关文章

  • Vue学习笔记之ElementUI的区间设置
    <template><divclass="app-containerhome"><el-formref="form":inline="true":model="form":rules="rules"><el-form-itemprop="min"><el......
  • 性能笔记---测试指标
    性能指标响应时间(t):自动化性能测试工具中的响应时间指的是客户端向服务器发起请求到客户端接收到响应所花费的时间吞吐量(快):强调对于某个事务的处理有多快容量(多):则强调......
  • 波特率计算笔记
    一、波特率为9600表示的是串口每秒钟可以传输9600bit,每传输1bit所需时间:1s/9600bit=1000000(us)/9600(bit)=1000/9.6=104.1667us 那么8bit就是104.1667∗8......
  • Java开发笔记之项目启动报错expected at least 1 bean which qualifies as autowire c
    看下spring容器启动时报错,看报错图: 需要检查如下:/**1.application.yml内的mybatis->mapper-location和type-aliases-package路径是否覆盖该对象;2.mapper目录......
  • 算法笔记之前缀和与差分
    什么是前缀和定义前缀和(PrefixSum):对于一个给定的数列\(a\),它的前缀和数列\(sum\)是通过递推能求出来得\(sum_i=\sum_{j=1}^{i}a_j\)部分和。也就是指某一序列......
  • 企业微信邮箱定时发送邮件,但无法撤回
      企业微信邮箱定时发送邮件,设置为第二天发送,等到了第二天,在自助查询的时候可以看到发信时间为昨天设置定时发送的时间,而且在这里点撤回键也无法撤回。需要在邮件里面......
  • Cgroup学习笔记4—相关DEBUG
    一、相关DEBUG接口1.cat/proc/mounts|grepcgroup可以查看每个子系统挂载位置等信息#cat/proc/mounts|grepcgroupnone/dev/blkiocgrouprw,nosuid,nodev,n......
  • 韦东山2440-学习笔记-设备树
    简单上手1.环境搭建按照资料建立的开发环境,遇到个问题VFS:Mountedroot(yaffsfilesystem)ondevice31:4.Freeingunusedkernelmemory:200KThisarchitecture......
  • 人人商城强制关闭微信授权登录
    1.core/inc/functions.phpif(!function_exists('is_weixin')){ functionis_weixin() { global$_W;returnfalse; if(EWEI_SHOPV2_DEBUG){ returntru......
  • Vue学习笔记之npm install编译时报"Cannot read properties of null (reading ‘pickA
    0x00概述在启动项目时候,没注意node版本,直接npminstall遇到该错误;该错误主要是由node高低版本导致的。 0x01node版本一致/**1.重新安装node解决2.删了nod......