1.小程序 API 介绍
1.小程序开发框架提供丰富的微信原生 API,可以方便的调起微信提供的能力,例如:获取用户信息、微信登录、微信支付等,小程序提供的API几乎都挂载在 wx对象下,例如:wx.request()、wx.setStorage()等,wx 对象实际上就是小程序的宿主环境微信所提供的全局对象
2.小程序 API 分类
1.异步 API 特征:通常都接受一个 object 类型的参数,例如:wx.request(0)
2.同步 API 特征:约定以 Sync 结尾,例如:wx.setStorageSync()
3.事件监听 API 特征:约定以 on 开头,例如:wx.onAppHide()
3.异步 AP| 支持 callback & Promise 两种调用方式:
1.当接口参数 Object 对象中不包含 success/fai/complete 时将默认返回 Promise
2.部分接口如 reouest. upioadFile, 本身就有返回值,因此不支持 Promise,风格的调用方式,它们的 promisifv 需要开发者自行封装
2.网络请求
1.发起网络请求获取服务器的数据,需要使用 wx.request()接口 API
2.wx.request请求的域名必须在微信公众平台进行配置,如果使用 wx.request 请求未配置的域名,在控制台会有相应的报错。
3.跳过域名的校验的开发:
1.在微信开发者工具中,点击详情按钮,切换到本地详情,将不校验合法域名、web-view (业务域名)、TLS版本以及HTTPS证书 勾选上
2.在真机上,需要点击胶囊区域的分析按钮,在弹框中选择 开发调试,重启小程序后即可
3.注意事项:
这两种方式只适用于开发者工具、小程序的开发版和小程序的体验版,项目上线前必须在小程序管理平台进行合法域名的配置
3.界面交互-loading 提示框
1.小程序提供了一些用于界面交互的 API,例如: loading 提示框、消息提示框、模态对话框等 API
2.loading 提示框常配合网络请求来使用,用于增加用户体验,对应的API有两个:
1.wx.showLoading()显示loading 提示框
//是否展示透明蒙层,防止触摸穿透:mask: true
2.wx.hideLoading()关闭 loading 提示框
4.界面交互-模态对话框-消息提示框
1.wx.showModal():模态对话框,常用于询问用户是否执行一些操作
例如:询问用户是否退出登录、是否删除该商品 等
2.wx.showToast():消息提示框,根据用户的某些操作来告知操作的结果
例如:退出成功给用户提示,提示删除成功等
5.本地存储
1.小程序本地存储是指在小程序中使用 AP|将数据存储在用户的设备上,以便小程序运行时和下次启动时快速地读取这些数据
2.小程序本地存储:
1.同步 API
存储:wx.setStorageSync()
//第一个参数:本地存储中指定的 key
//第二个参数:需要存储的数据
//如果存储的是对象类型数据,不需要使用 JSON.stringify 和 JSON.parse 进行转换
//直接进行存储和获取即可
获取:wx.getStorageSync()
删除:wx.removeStorageSync()
清空:wx.clearStorageSync()
2.异步 API
存储:wx.setStorage()
获取:wx.getStorage()
删除:wx.removeStorage()
清空:wx.clearStorage()
6.路由与通信
在小程序中实现页面的跳转,有两种方式:
1.声明式导航:navigator 组件
2.编程式导航:使用小程序提供的 API
3.编程式导航 API:
1.wx.navigateTo():保留当前页面,跳转到应用内的某个页面,但是不能跳到tabbar 页面
2.wx.redirectTo():关闭当前页面,跳转到应用内的某个页面。但是不允许跳转到 tabbar 页面
3.wx.switchTab():跳转到 tabBar 页面,路径后不能带参数
4.wx.reLaunch():关闭所有页面,打开到应用内的某个页面
5.wx.navigateBack():关闭当前页面,返回上一页面或多级页面
4.路径后可以带参数,参数与路径之间使用?分隔,参数键与参数值用=相连,不同参数用&分隔,例如:path?key=value&key2=value2参数需要在跳转到的页面的 onLoad 钩子函数 中通过形参进行接收
7.页面处理函数-上拉加载
1.上拉加载是小程序中常见的一种加载方式,当用户滑动页面到底部时,会自动加载更多的内容,以便用户继续浏览
2.小程序中实现上拉加载的方式:
1.在 app.json 或者 page.json 中配置距离页面底部距离: onReachBottomDistance;默认 50px
2.在 页面.is 中定义 onReachBottom 事件监听用户上拉加载
8.页面处理函数-下拉刷新
1.下拉刷新是小程序中常见的一种刷新方式,当用户下拉页面时,页面会自动刷新,以便用户获取最新的内容。
2.小程序中实现上拉加载更多的方式
1.在 app.json 或者 page.json 中开启允许下拉,同时可以配置 窗口、loading 样式等
2.在 页面.is 中定义 onPullDownRefresh 事件监听用户下拉刷新
9.增强 scroll-view
使用 scroll-view 实现上拉加载更多和下拉刷新功能
10.创建和注册组件
1.小程序目前已经支持组件化开发,可以将页面中的功能模块抽取成自定义组件,以便在不同的页面中重复使用;也可以将复杂的页面拆分成多个低耦合的模块,有助于代码维护。
2.开发中常见的组件有两种:
1.公共组件:将页面内的功能模块抽取成自定义组件,以便在不同的页面中重复使用
2页面组件:将复杂的页面拆分成多个低耦合的模块,有助于代码维护