平台兼容性

Vue2 Vue3
×
App 快应用 微信小程序 支付宝小程序 百度小程序 字节小程序 QQ小程序
× × × × × ×
钉钉小程序 快手小程序 飞书小程序 京东小程序
× × × ×
H5-Safari Android Browser 微信浏览器(Android) QQ浏览器(Android) Chrome IE Edge Firefox PC-Safari
× × × × × × × × ×

云开发HTTP二次框架

强烈推荐使用async与await模式进行伪同步开发.

首次使用, 请到文件内修改测试与线上环境

let env = 'dev-xxx'
if(isRelease) env = 'res-yyy'

说明

提供增删改查, 即add remove update get四种基础函数,也可以在此基础上定制其他, 比如源码中的更新用户专用函数:

/**
 * 改的专门用在用户上
 */
async updateUser(docID = '', data = {}, isSet) {
  return await http.update('_USER', docID, data, isSet)
},

如上, 再次加工非常简单.

使用

main.js

import Vue from 'vue'
import http from './plugins/zz-http.js'
Vue.use(http)

示例

方括号为具体参数

/**
 * 增
 */
async add(storeID) {
  let res = await this.$add('_USER', [data])
}
/**
 * 删
 */
async remove(storeID) {
  let res = await this.$remove('_USER', [_id])
}
/**
 * 改
 */
async update(storeID) {
  let res = await this.$update('_USER', [_id], [data], [isSet])
}
/**
 * 查
 */
async get(storeID) {
  let res = await this.$get('_USER', [data])
}

核心函数

函数名同步小程序云开发名, 不用额外记忆.

let http = {
  /**
   * 增
   */
  async add(collectionName, data = {}) {
    if (arguments.length < 2) {
      console.error('参数数量不足')
      return
    }
    let result = null
    await collection(collectionName).add({
      // data 字段表示需新增的 JSON 数据
      data,
    }).then(res => {
      result = res
    }).catch(errHandle)
    return result
  },
  /**
   * 删, 只支持单个删除, 多个删除需要云函数处理
   */
  async remove(collectionName, docID) {
    if (arguments.length < 2) {
      console.error('参数数量不足')
      return
    }
    let result = null
    await collection(collectionName).doc(docID).remove()
      .then(res => result = res)
      .catch(errHandle)
    return result
  },
  /**
   * 改, 理解顺序: 找到collection, 指定id, 然后更新数据(先找到再更新), 局部更新
   * @param {string} docID 单个更新指定_id
   * @param {boolean} isSet 是否替换, 与update不同在于, set是把指定的替换了, 而不是更新. 这里用来专门处理更新某个数据, 而不是更新其内部, 更新内部使用_.set
   * @remind 多更新需要通过云函数处理, 这里无法操作
   */
  async update(collectionName, docID = '', data = {}, isSet) {
    if (arguments.length < 3) {
      console.error('参数数量不足')
      return
    }
    let result = null
    if (isSet) {
      await collection(collectionName).doc(docID).set({ data })
        .then(res => result = res)
        .catch(errHandle)
    } else {
      await collection(collectionName).doc(docID).update({ data })
        .then(res => result = res)
        .catch(errHandle)
    }
    return result
  },
  /**
   * 查, 一次最多只有100条
   * @param {object} whereData 多个查询的条件对象
   * @param {string} docID 单个查询传入_id
   */
  async get(collectionName, whereData, docID) {
    if (arguments.length < 1) {
      console.error('参数数量不足')
      return
    }
    let result = null
    if (whereData) {
      await collection(collectionName).where(whereData).get()
        .then(res => result = res)
        .catch(errHandle)
    } else if (docID) {
      await collection(collectionName).doc(docID).get()
        .then(res => result = res)
        .catch(errHandle)
    } else {
      await collection(collectionName).get()
        .then(res => result = res)
        .catch(errHandle)
    }
    return result
  },
}

另外, 云开发的command即_, 也同步至vue实例的this.$_上.

其他

比如环境切换等, 都在该插件里面处理.

隐私、权限声明

1. 本插件需要申请的系统权限列表:

网络请求

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

许可协议

MIT协议

暂无用户评论。

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问