demo使用云开发,添加输入数据，在云服务中插入云控制台中的数据库，查询返回给小程序列表显示

进来看的伸伸手点个赞哦

wxml中

<view class="container">
  <view class="photo-center" flex-item>
    <image class="poster" src="{{imagePath}}" bindtap="uploadImage" />
  </view>
  <view class="item-name">
    <view class="item-content">
      <text>姓名</text>
      <input class="name-input" placeholder="请输入姓名" type="text" bindinput="getInputName" />
    </view>
  </view>
  <view class="user-profile">
    <text>简介： </text>
    <input class="profile-input" placeholder="请输入简介" type="text" bindinput="getInputProfile"/>
  </view>
  <button class="commit">提交</button>
</view>

样式我就不贴出来了，也就是html中的style，讲重点，不然文章有点太长了。

下面直接重点接口上传信息，插入云控制台数据库，

我们在云控制台中的数据库中需要新建一个集合我这里命名UserAccountList这个下面会用到

云开发中cloudfunctions里面新建Node.js，我命名register，小程序中调用这个接口需要用到这个名称

// 云函数入口文件

const cloud = require('wx-server-sdk')

//初始化

cloud.init({

// API 调用都保持和云函数当前所在环境一致

env: cloud.DYNAMIC_CURRENT_ENV

})

const db = cloud.database()

// 云函数入口函数

exports.main = async(event, context) => {

console.log('cloundinsertevent', event)

await db.collection('UserAccountList').add({
      // data 字段表示需新增的 JSON 数据
      data: {
        // event,
        appId:event.appId,
        openId:event.openId,
        title: event.name,
        profile: event.profile,
        images: {
          small: event.imagePath
        },
        time: Date.now(),
      }
    })
return {
      flag:1
    }

小程序中调用

 wx.cloud.callFunction({
      name: 'register',//云函数名
      data: {//传参
        name: this.data.name,
        profile: this.data.profile,
        imagePath:this.data.imagePath,
        openid: wx.openid,
        appid: wx.appid,
        unionid: wx.unionid,//无效
      },
      complete: res => {
        // console.log('callFunction register complete result: ', res)
      },
      success: res => {

        //返回上一级关闭当前页面
        wx.navigateBack({
          delta: 1
        })

提交后你会看到云控制台中数据库以后数据。

我们再写个云函数用来查数据库中的插入的数据集合

同样以上流程

在云函数listinfo入口函数中return await db.collection('UserAccountList').get()，

在列表中同样使用

wx.cloud.callFunction({

name: 'listinfo',//云函数名

success: res => {

console.log('list:',res.result)

这样就完成了前后段的一整个操作流程。

喜欢的点个赞哦