1.image
image组件也是一个程序不可缺少的,可以这样说一个app中image组件随处可以看到,一般 image有两种加载方式第一种是网络图片第二种是本地图片资源,都用src属性去指定
属性名 | 类型 | 默认值 | 说明 |
---|---|---|---|
src | String | 图片资源地址 | |
mode | String | 'scaleToFill' | 图片剪裁、缩放的模式 |
binderror | HandleEvent | 当错误发生时 , 发布到APPService的事件名 , 事件对象event.detail={ errMsg : 'something wrong'} | |
bindload | HandleEvent | 当图片载入完毕时 , 发布到APPService的事件名 , 事件对象event.detail = {} |
五种缩放模式:
模式 | 说明 |
---|---|
scaleToFill | 不保持纵横缩放比例 , 使图片的宽高完全拉伸至填满image元素 |
aspectFit | 保持纵横比例缩放图片 , 图片的长边能完全显示出来 . 也就是说 , 可以完整的将图片显示出来 |
aspectFill | 保持纵横比例缩放 , 只保证图片的短边能完全显示出来 . 也就是说 , 图片通常只在水平或垂直方向是完整的 , 另一个方向将会发生截取 |
widthFix | 缩放模式,宽度不变,高度自动变化,保持原图宽高比不变 |
heightFix | 缩放模式,高度不变,宽度自动变化,保持原图宽高比不变(2.10.3) |
九种剪切方式:
模式 | 说明 |
---|---|
top | 不缩放图片 , 只显示图片的顶部区域 |
bottom | 不缩放图片 , 只显示图片的底部区域 |
center | 不缩放图片 , 只显示图片的中间区域 |
left | 不缩放图片 , 只显示图片的左边区域 |
right | 不缩放图片 , 只显示图片的右边区域 |
top left | 不缩放图片 , 只显示图片的左上边区域 |
top right | 不缩放图片 , 只显示图片的右上边区域 |
bottom left | 不缩放图片 , 只显示图片的左下边区域 |
bottom right | 不缩放图片 , 只显示图片的右下边区域 |
2.picker 选择器
<picker>是从底部叹气的滚动选择器组件 , 目前根据mode属性值的不同共支持5种选择器 , 分别是普通选择器 , 多列选择器 , 时间选择器 , 日期选择器 , 省市区选择器 . 若省略mode值不写 , 默认效果是普通选择器
省市区选择器 : 当mode = "region" 时为省市区选择器效果(最低版本不为1.4.0)
属性名 | 类型 | 默认值 | 说明 |
---|---|---|---|
value | Array | [] | 表示选中是省市区 , 默认选中每一列的第一个值 |
custom-item | String | 可为每一列的顶部添加一个自定义的项 | |
bindchange | EventHandle | 当value改变时触发change事件 , event.detail={value.value} | |
bindcancel | EventHandle | 取消选择时触发 | |
disabled | Boolean | false | 是否禁用 |
3.网络API
和风天气 : 提供的API接口
根据网站的相关代码提示和接口信息制作url
回到微信公众平台 , 添加服务器域名(开发 - 开发设置 - 服务器域名 - request合法域名 : 填写和风天气域名https://free-api.heweather.net )
4.调用函数
this."函数名"(参数列表)
5.js文件
wx.request({
url:
data
success:function(e){
通常现在控制台输出查看一下
}
}) + 更改变量值