本站资源收集于互联网,不提供软件存储服务,每天免费更新优质的软件以及学习资源!

微信小程序新手教程scroll-view组件swiper组件icon组件

电脑教程 diannaojiaocheng 1℃

微信小程序新手教程scroll-view组件swiper组件icon组件

微信小程序新手教程scroll-view组件,swiper组件,icon组件,本篇默认已经成功安装微信小程序工具,来和小编一起看看吧

一:scroll-view组件

scroll-view为滚动视图,分为水平滚动和垂直滚动。注意滚动视图垂直滚动时一定要设置高度否则的话scroll-view不会生效。滚动视图常用的地方一般都是Item项比较多的界面,比如我的模块

主要属性:

 

二:swiper组件

Android 写过轮播图的痛楚只有写过的知道,相对还是比较麻烦的,并没有一个轮播图组件,有个ViewPage也需要自己定制,iOS 则多用UIScrollerView去实现,这个swiper封装的相对还是方便的,使用方式也相对那俩容易些。

主要属性:

属性只需要设置就行了 也可以抽到js文件的data中进行数据绑定,监听使用bindchange,在js中做业务处理。

wxml

js:

Page({

data:{

// text:"这是一个页面"

},

/**

* 这里处理滚动事件处理

*/

listenSwiper:function(e) {

//打印信息

console.log(e)

},

onLoad:function(options){

// 页面初始化 options为页面跳转所带来的参数

},

onReady:function(){

// 页面渲染完成

},

onShow:function(){

// 页面显示

},

onHide:function(){

// 页面隐藏

},

onUnload:function(){

// 页面关闭

}

})

三:icon组件

这些是提供的所支持的图标样式,根据需求在此基础上去修改大小和颜色。

主要属性:

使用方式:

wxml

转载请注明:范的资源库 » 微信小程序新手教程scroll-view组件swiper组件icon组件

喜欢 (0)