RxWX在小程序和wepy中的使用方法

之前写过一个开源项目RxWX，将RxJS移植到微信小程序（以下简称”小程序“）中。

RxWX项目地址和介绍：https://github.com/yalishizhude/RxWX

关于RxJS的介绍，读者可以去看官方说明或者关注公众号“Web学习社”的后续文章介绍，这篇文章主要讲解RxWX的几个使用场景。

微信小程序SDK版本：1.7.0

微信开发者工具版本：1.01

演示项目下载地址：

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

在小程序中使用

按照RxWX说明，把Rx.js和RxWX.js文件放入到utils目录下。

其中Rx.js是可运行在小程序中的Rx.js模块，RxWX.js是利用Rx.js对小程序API进行的封装，封装后API函数将返回Observable对象，属性值不变。

使用时必须引入该文件，比如

同步API与异步API

看上去好像没太大区别。别着急，接着我们来继续看看异步API的调用~

在调用同步时RxWX没有太大优势，但在调用异步API的时候以流的方式来处理结果和异常，显然优于回调。

而且代码内容和同步调用方式相比并无变化（只修改了函数名和入参）。

这种统一的操作方式可以让开发者更好的关注业务逻辑，而不需要去分辨API到底是异步还是同步，执行结果到底是在回调中获取还是返回值获取。

这种处理方式是不是让你想起点什么？欢迎留言讨论~

嵌套

登录后获取用户信息。

原生写法很容易坠入回调地狱，而利用RxWx的代码直观易读。

合并

同时获取用户信息和系统信息后进行操作。

在wepy中使用

代码目录：https://github.com/yalishizhude/RxWX/tree/master/example4wepy

wepy是一个比较火的小程序框架，采用预编译的方式，让开发者可以用Vuejs风格的组件化方式开发小程序，同时还支持Node.js模块。

官网地址：https://tencent.github.io/wepy/

安装RxWX

当然我更推荐你使用yarn

引入模块

使用rxwx

wepy版本：1.6.0

用命令初始化项目之后，我们以app.wpy和index.wpy两个文件代码为例，改成用RxWX实现。

首先是根组件中的函数。

默认代码用到了wepy封装的小程序API和回调函数。

如果我们引入RxWX的话不再需要从wepy调用小程序API了，默认引入RxWX模块，带有小程序API，Rx属性下带有RxJS函数。

然后修改中的函数。

我们可以直接采用RxJS的流式写法并使用操作符。