微信云函数开发小程序第二章【纯前台+云存储+云开发构建+ivewApp组件】(增删改查)

 

前情介绍:公司技术开发者在做项目中,简单规划分为(前端开发工程师)、
(后端开发工程师)一起去开发项目,前端主要搭建(展示给用户看到的渲染层架构)
,搭建页面渲染框架跟结构,后端搭建服务层架构,前端需要请求后台接口去操作数据
的增删改查页面逻辑渲染,云函数开发其实就是把整体体系都连贯在一起,包括云存储
,数据库,直接忽略掉X后端开发工程师,前端开发工程师可以直接从头到尾开发项目
到部署发布,(相当于忽略掉后端开发工程师的钱拿来买云存储,云数据库)当然小
型项目(小程序可以目前这样,H5可以用Uniapp的DCloud)

这里我举两个例子:

微信小程序云函数开发:
云函数即在云端(服务器端)运行的函数。在物理设计上,一个云函数可由多个文件组成,
占用一定量的 CPU 内存等计算资源;各云函数完全独立;可分别部署在不同的地区。
开发者无需购买、搭建服务器,只需编写函数代码并部署到云端即可在小程序端调用
,同时云函数之间也可互相调用。
一个云函数的写法与一个在本地定义的 JavaScript 方法无异,代码运行在云端 
Node.js 中。当云函数被小程序端调用时,定义的代码会被放在 Node.js 运行环境中执行。
我们可以如在 Node.js 环境中使用 JavaScript 一样在云函数中进行网络请求等操作,
而且我们还可以通过云函数后端 SDK 搭配使用多种服务,比如使用云函数 SDK 中提供的
数据库和存储 API 进行数据库和存储的操作,这部分可参考数据库和存储后端 API 文档。
云开发的云函数的独特优势在于与微信登录鉴权的无缝整合。当小程序端调用云函数时,
云函数的传入参数中会被注入小程序端用户的 openid,开发者无需校验 openid 的正确性
因为微信已经完成了这部分鉴权,开发者可以直接使用该 openid。



uniCloud 的价值
1:对于程序员,从此你又get一个新技能,用熟悉的js,轻松搞定前后台整体业务。
2:对于开发商:
开发成本大幅下降。不用再雇佣php或java等服务器工程师,每年至少节省几十万;
你只需专注于你的业务,其他什么服务器运维、弹性扩容、防DDoS攻击,全都不需要操心;
如果不发布H5版,你将不需要购买备案域名。小程序和App可以免域名使用服务器;
对于敏捷性业务,前后端分离的沟通成本实在没有必要。可以考虑按业务负责分工,而不是按前后台分工。

微信云函数开发小程序第二章【纯前台+云存储+云开发构建+ivewApp组件】(增删改查)_第1张图片 微信云函数开发小程序第二章【纯前台+云存储+云开发构建+ivewApp组件】(增删改查)_第2张图片微信云函数开发小程序第二章【纯前台+云存储+云开发构建+ivewApp组件】(增删改查)_第3张图片微信云函数开发小程序第二章【纯前台+云存储+云开发构建+ivewApp组件】(增删改查)_第4张图片

//如上图所示纯前台实现增删改查:

使用技术:1:微信小程序API,
         2:微信小程序开发语言,
         3:云函数开发,
         4:云存储,
         5:云数据库,
         6:ivewApp框架UI

开发步骤:1>新建小程序项目(这里记得后端服务选择 【小程序云开发】)
         2>简单搭建页面就行(简单的增删改查)
         3>创建云数据库表结构
         4>js中链接数据库,请求数据库数据

下下下====>↓↓↓↓↓

简单介绍如何创建云数据库,以及云数据库表结构的文章在上一篇文章,小伙伴可以去了解一下,
下面来介绍一下链接数据库的增删改查
/**首先第一步声明一个全局变量连接数据库 */
const testDB = wx.cloud.database();

/**查询数据库**/
  initData() {
    /**查询刚刚创建的表结构的数据*/
    testDB.collection('你的表结构名称').get().then(res => {
      /**在这里请求数据库获取刚刚创建的表结构数据 */
      console.log("在这里获取创建的数据库中的表数据==>", res)
      this.setData({
        list: res.data
      })
    })
  },


/**添加数据**/
  AddData() {
    testDB.collection("你的表结构名称").add({
        data: {
          /**添加的参数**/
          name: this.data.name,
          phone: this.data.phone,
          address: this.data.address
        },
        success(res) {
          console.log("添加成功==>", res);
        },
        fail(res) {
          console.log("添加失败===>", res);
        }
      })
  },
  /**修改数据**/
   updateDate(){
     testDB.collection("你的表结构名称").doc(通过ID去修改,你需要传递的ID).update({
        data: {
          name: this.data.name,
          phone: this.data.phone,
          address: this.data.address
        },
        success(res) {
          console.log("修改成功!", res);
        },
        fail(res) {
          console.log("修改失败===>", res);
        }
      })}
/**根据ID删除数据**/
   updateDate(){
   testDB.collection('你的表结构名称').doc(需要传递ID).remove({
      success: function(res) {
        console.log("删除数据===>", res);
      },
      fail(res) {
      console.log("修改失败===>", res);
    }
    })
}

微信云函数开发小程序第二章【纯前台+云存储+云开发构建+ivewApp组件】(增删改查)_第5张图片

 

你可能感兴趣的:(小程序,前端)