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){
通常现在控制台输出查看一下
}
}) + 更改变量值
网友评论