百合互慰无码免费视频在线观看,AV无码专区亚洲AVL在线观看,18禁美女无遮挡黄网站免费看视

无码人妻精品一区二区蜜桃百度,日本猛少妇色xxxxx猛交,免费无码黄真人影片在线,亚洲a成人午夜天堂

12月

RxWX使用教程

1338

之前寫(xiě)過(guò)一個(gè)開(kāi)源項(xiàng)目 RxWX ，將RxJS移植到微信小程序（以下簡(jiǎn)稱(chēng)”小程序“）中。

RxWX項(xiàng)目地址和介紹： http://github.com/yalishizhude/RxWX

關(guān)于RxJS的介紹，讀者可以去看官方說(shuō)明或者關(guān)注公眾號(hào)“Web學(xué)習(xí)社”的后續(xù)文章介紹，這篇文章主要講解RxWX的幾個(gè)使用場(chǎng)景。

微信小程序SDK版本：1.7.0

微信開(kāi)發(fā)者工具版本：1.01

演示項(xiàng)目下載地址：

http://github.com/yalishizhude/RxWX/tree/master/example

Get started

按照RxWX說(shuō)明，把Rx.js和RxWX.js文件放入到utils目錄下。

其中Rx.js是可運(yùn)行在小程序中的Rx.js模塊，RxWX.js是利用Rx.js對(duì)小程序API進(jìn)行的封裝，封裝后API函數(shù)將返回Observable對(duì)象，屬性值不變。

使用時(shí)必須引入該文件，比如

import rxwx from '../../utils/RxWX.js'

同步API與異步API

// 原寫(xiě)法
try {
  let result = wx.removeStorageSync('xx')
  console.log(result) 
} catch(e) {
  console.error('小程序API發(fā)現(xiàn)錯(cuò)誤')
}

// 使用RxWX
import rxwx from '../../utils/RxWX.js'

rxwx.removeStorageSync('xx')
  .catch((e) => console.error('RxWX發(fā)現(xiàn)錯(cuò)誤'))
  .subscribe((resp) => console.log(resp))

看上去好像沒(méi)太大區(qū)別。別著急，接著我們來(lái)繼續(xù)看看異步API的調(diào)用~

// 原寫(xiě)法
wx.removeStorage({
  key: 'xx',
  success: function(res) {
    console.log(res)
  },
  error: function(e) {
    console.error('小程序API發(fā)現(xiàn)錯(cuò)誤')
  }
})
// 引用RxWX，rxwx具有wx的所有函數(shù)和值，但是調(diào)用函數(shù)返回的是Observable對(duì)象
import rxwx from '../../utils/RxWX.js'

rxwx.removeStorage({key: 'xx'})
  .catch((e) => console.error('RxWX發(fā)現(xiàn)錯(cuò)誤'))
  .subscribe((resp) => console.log(resp))

在調(diào)用同步時(shí)RxWX沒(méi)有太大優(yōu)勢(shì)，但在調(diào)用異步API的時(shí)候以流的方式來(lái)處理結(jié)果和異常，顯然優(yōu)于回調(diào)。

而且代碼內(nèi)容和同步調(diào)用方式相比并無(wú)變化（只修改了函數(shù)名和入?yún)ⅲ?/p>

這種統(tǒng)一的操作方式可以讓開(kāi)發(fā)者更好的關(guān)注業(yè)務(wù)邏輯，而不需要去分辨API到底是異步還是同步，執(zhí)行結(jié)果到底是在回調(diào)中獲取還是返回值獲取。

這種處理方式是不是讓你想起點(diǎn)什么？歡迎留言討論~

嵌套

登錄后獲取用戶(hù)信息。

// 調(diào)用小程序原生API
wx.login({
  success(res) {
    wx.getUserInfo({
      success(res) {
        console.log(res.userInfo)
      },
      fail(e) {
        console.error(e)
      }
    })
  },
  fail(e) {
    console.error(e)
  }
})

// 調(diào)用RxWX
import rxwx from '../../utils/RxWX.js'

rxwx.login()
  .switchMap(() => rxwx.getUserInfo())
  .catch(e => console.error(e))
  .subscribe(res => console.log(res.userInfo))

原生寫(xiě)法很容易墜入回調(diào)地獄，而利用RxWx的代碼直觀易讀。

合并

同時(shí)獲取用戶(hù)信息和系統(tǒng)信息后進(jìn)行操作。

// 調(diào)用小程序API
let getUser =  new Promise((success, fail) => {
  wx.getUserInfo({
    success,
    fail
  })
})
let getSystem =  new Promise((success, fail) => {
  wx.getSystemInfo({
    success,
    fail
  })
})
Promise.all([getUser, getSystem])
.then((resp) => console.log(resp), e => console.error(e))

// 調(diào)用RxWX
import rxwx, {Rx} from '../../utils/RxWX.js'

Rx.Observable.zip(rxwx.getUserInfo(), rxwx.getSystemInfo())
  .catch(e => console.error(e))
  .subscribe(resp => console.log(resp))