小程序云开发

概念：开发者可以使用云开发开发微信小程序、小游戏，无需搭建服务器，即可使用云端能力。让前端工作者有了后端的能力。

1.创建步骤

1 创建项目时，选择云开发
.2点击界面导航栏的云开发，创建数据库，并添加字段
3page文件夹创建home文件，并在云开发中创建云函数(云函数需要上传服务器才能执行调用，就是node.js)
4在couldfunctions中新建云函数文件夹 ，之后右键选择上传并安装依赖云端依赖

2 获取数据库

3.获取留言和发表留言

home.wxml

<!-- 添加 -->
<view>
  <textarea value="{{msg}}" style="background-color: #ccc; width: 100%;" bindinput="inputHd" />
  <button type="primary" bindtap="addFeed">发表</button>
</view>
<view class="list">
  <view wx:for="{{list}}" wx:key="_id">
    <view>
      <image src="{{item.userInfo.avatarUrl}}" style="width: 33px;height: 33px;" mode=""/>
      <text>{{item.userInfo.nickName}}
      </text><text>-{{item.datetime}}</text></view>
    <view>{{item.msg}}</view>
  </view>
</view>

home.js

const { formatDate } = require("../../utils/index");

// pages/home/home.js
Page({

  /**
   * 页面的初始数据
   */
  data: {
    list:[],
    msg:{},
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
    this.getFeedback();
  },
  inputHd(e){
    this.setData({msg:e.detail.value})
  },
  addFeed(){
    const userInfo = wx.getStorageSync('userInfo');
    if(userInfo&&userInfo.nickName){
      this.sendFeed();
    }else{
      wx.getUserProfile({
        desc: '需要用户头像',
        success:(res)=>{
          wx.setStorageSync('userInfo',res.userInfo)
          this.sendFeed()
        }
      })
    }
  },
  sendFeed(){
    console.log("发表留言");
    wx.cloud.callFunction({
      name:"addFeed",
      data:{
        msg:this.data.msg,
        userInfo:wx.getStorageSync('userInfo')
      }
    })
    .then(res=>{
      console.log(res);
      this.getFeedback()
      this.setData({msg:""})
    })
    .catch(err=>{
      console.log("err",err);
    })
  },
  getFeedback(){
    wx.cloud.callFunction({
      name:"feedback",
      data:{a:3,b:2}
    })
    .then(res=>{
      console.log(res.result);
      // this.setData({list:res.result.data})
      this.setData({list:res.result.data.map(item=>({...item,datetime:formatDate(item.datetime,"-")}))})
    })
    .catch(err=>{
      console.log(err);
    })
  },

feedback/index.js

// 云函数入口文件
const cloud = require('wx-server-sdk')
cloud.init({env:"cloud1-7g3r3c1n1606fd28"})
const db = cloud.database();
cloud.init({ env: cloud.DYNAMIC_CURRENT_ENV }) // 使用当前云环境

// 云函数入口函数
exports.main = async (event, context) => {
  const wxContext = cloud.getWXContext()
  const data = await db.collection("feedback").get()
  return {
    data:data.data,
    event,
    sum:event.a+event.b,
    openid: wxContext.OPENID,
    appid: wxContext.APPID,
    unionid: wxContext.UNIONID,
  }
}

addFeed/index.js

// 云函数入口文件
const cloud = require('wx-server-sdk')
cloud.init({env:"cloud1-7g3r3c1n1606fd28"})
const db = cloud.database();

// 云函数入口函数
exports.main = async (event, context) => {
  const wxContext = cloud.getWXContext()        
                                                                                                                                               
  const data = await db.collection('feedback').add({
    data:{
      msg:event.msg,
      datetime:new Date(),
      userInfo:event.userInfo
    }
  })
  return {
    data:data.data,
    event,
    openid: wxContext.OPENID,
    appid: wxContext.APPID,
    unionid: wxContext.UNIONID,
  }
}

4 日期格式化函数的封装

module.exports = {
  formatDate(str,d1="/",d2=":"){
    var d =new Date(str)
    var yyyy = d.getFullYear();
    var MM = d.getMonth();
    var dd = d.getDate();
    var HH = d.getHours();

    var mm =d.getMinutes();
    var ss = d.getSeconds();
    var arr1 = [yyyy,MM,dd].map(item=>String(item).padStart(2,"0"))
    var arr2 = [HH,mm,ss].map(item=>String(item).padStart(2,"0"))
    //用d1连接年月日。用d2连接时分秒
    return arr1.join(d1)+" "+arr2.join(d2)
  }
}

5 . 云数据，排序，分页，搜索查询的api

1.云数据的上传
2.排序
3.分页
4搜索查询的api

6.云上传