npm 包 wx-client 使用教程

在小程序开发中，我们经常会遇到需要调用微信 API 的情境，比如获取用户信息或者支付功能等等，而在调用微信 API 时，需要使用到微信提供的 SDK，如果我们是使用原生开发的话，可以在项目中引入资源，然后进行调用，但是如果是使用小程序开发框架来进行开发的话，我们需要使用到一个基于 Promise 的封装库——wx-client。

wx-client 是一个用于调用微信小程序 API 的 npm 包，也是一个封装程度比较高的库，使用者可以很方便地使用这个库来进行微信小程序的开发。下面是一个详细的使用教程。

安装 wx-client

在使用 wx-client 之前，我们要在项目中使用 npm 安装这个包，打开命令行终端，然后执行以下命令：

npm install wx-client --save

这个命令执行完之后，wx-client 的安装就完成了。

在小程序中使用 wx-client

我们知道，在小程序中，我们通常会使用 Page 或 Component 的方式来进行页面的开发。

在页面或者组件的 js 文件中引入 wx-client，然后进行使用：

import wx from 'wx-client';

wx.login().then(res => {
    // 执行一些操作
}).catch(err => {
    // 错误处理
});

在上面的代码片段中，我们通过 import 引入了 wx-client 这个库，然后使用了其中的一个方法——login 方法，这个方法会调用微信的登录 API，然后返回一个 Promise。如果请求成功，我们就会拿到一个 code，如果请求失败，就会返回一个错误对象。

在 wx-client 中，每一个微信 API 都会被封装成一个 Promise 对象，使用起来非常方便。

示例代码

下面是一个使用 wx-client 实现微信登录功能的示例代码：

import wx from 'wx-client';

Page({
  data: {

  },
  onLoad() {
    // 页面加载时，调用登录方法
    wx.login().then(res => {
      if (res.code) {
        // 登录成功，将 code 发送到服务器
        wx.request({
          url: 'https://example.com/login',
          data: {
            code: res.code
          },
          success(res) {
            console.log(res);
          }
        });
      } else {
        // 登录失败
        console.log('登录失败！' + res.errMsg);
      }
    }).catch(err => {
      console.log('登录失败！' + err);
    });
  }
});

在这个例子中，我们在页面加载时调用了 wx.login 方法，如果登录成功就会返回一个 code，然后我们将这个 code 发送到服务器。如果登录失败就会在控制台输出错误信息。

结语

wx-client 是一个非常好用的封装库，不仅封装程度高，可以大大简化我们的开发过程，而且还提供了非常详尽的文档和示例代码，让开发者很容易上手。希望这篇文章对大家有所帮助。

来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/600673dffb81d47349e53c13