持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第4天
一、微信小程序API是什么？
API（Application Programming Interface,应用程序编程接口），通俗来讲：API是一种接口函数，把函数封装起来，给开发者，这样好多的功能就不需要你去实现了，只要会调用就好了。微信小程序利用API就可以实现用户信息、数据存储、微信支付等功能。
二、API运行机制
API接口大多数是由后端编写，前端开发人员进行请求调用。通俗理解api就是搞一些拿过来就能用的东西，方便我们的开发。
小程序API中有同步与异步之分，凡是后缀带Sync的都为同步，其他则为异步。
在涉及到缓存的时候，一般我们建议用同步的写法，异步的写法其实是一种非常危险的写法：
- 第一点，它会让代码变得难以阅读；
- 第二点，它会引起许多未知的错误，如果对异步的方法不是很熟悉，建议能用同步就用同步，千万不要用异步，当然小程序里面有些情况是必须用异步的，但是在小程序里面用到异步的情况会非常的少。
同步VS异步：
同步的缺陷是什么呢？
方法执行很慢的时候整个UI会卡住，同步的方法运行不过去，后面的方法就走不了，所以呢，代码的耗时就会非常长，这是同步的缺点。
异步的好处呢？
代码会立刻走完，然后获取到缓存以后，由框架再去调用success，整个流程会很快的走完，不会让UI有停滞的效果，这是异步的一个优势。
三、常用API
小程序API分为如下3大类
1、事件监听API
特点:以on开头,用来监听某些事件的触发 举例:wx.onWindowResize(function callback)监听窗口尺寸变化的事件
2、同步API
特点1:以Sync结尾的API都是同步API
特点2:同步API的执行结果,可以通过函数返回值直接获取,如果执行出错会抛出错误如：wx.setStorageSync('key','value')向本地存储中写入内容
3、异步API
特点:类似于jQuery中的$.ajax(options)函数,需要通过success、fail、complete接收调用的结果。如:wx.request()发起网络数据请求,通过success回调函数接受数据
| 类型 | 绑定方式 | 事件描述 |
|---|---|---|
| tap | bindtap或bind:tap | 手指触摸后马上离开,类似于HTML中的click事件 |
| input | bindinput或bind:input | 文本框的输入事件 |
| change | bindchange或bind:change | 状态改变时触发 |
点击内部的按钮时,点击事件以冒泡的方式向外扩散,也会触发外层的tap事件处理函数,此时,对于外层的组件来说
- e.target指向的是触发事件的源头组件,因此,e.target是触发冒泡事件的内部组件
- e.currentTarget指向的是当前正在触发事件的那个组件,因此,e.currentTarget是当前的外层组件
- 可以调用this.setData(dataObject)方法,给页面data中的数据重新赋值
事件传参:小程序中的事件传参比较特殊,不能在绑定事件的同事为事件处理函数传递参数,例如:下面的代码不能正常工作
<button type="primary" bindtap='btnHandler(123)'>传参</button>
可以为组件提供data-自定义属性传参,其中代表的是参数的名字,实例代码如下:
<button bindtap="btnHandler" data-info="{{2}}">事件传参</button>
最终:
- info会被解析为参数的名字
- 数值2会被解析为参数的值
在事件处理函数中,通过event.target.dataset.参数名即可获取到具体参数的值,示例代码如下:
btnHandler(event){
//dataset 是一个对象 包含了所有通过data-*传递过来的参数项
console.log(event.target.datastr)
//通过 dataset 可以访问到具体参数的值
console.log(event.target.dataset.info)
}
烟火向星辰，所愿皆成真！
