#前端# 小程序云开发

基本功能:
在这里插入图片描述
在这里插入图片描述

目录结构:
在这里插入图片描述
index.html

<view>
  username: <input bindinput="addName"></input>
  password: <input type="password" bindinput="addPwd"></input>
  <button class="btn" bindtap="add" type="primary">添加数据</button>

  <button bindtap="search" type="primary">查询数据</button>
  
  id: <input bindinput="delId"></input>
  <button bindtap="del">删除数据</button>

  更新的id: <input bindinput="updId"></input>
  更新的用户名: <input bindinput="updUsername"></input>
  <button bindtap="upd">更新数据</button>

  <button bindtap="addFunc">调用加法云函数</button>

  <button bindtap="getOpenId">获取openId</button>

  <button bindtap="searchFromSQl">数据库查询列表</button>
  <button bindtap="searchFromCloud">云函数查询列表</button>

  <button bindtap="uploadImg">上传图片</button>
  <image src="{{ img }}"></image>

  <button bindtap="uploadFile">上传文件(doc/exec/pdf)</button>
  <button bindtap="openXslx">下载并打开文档</button>
</view>

index.js

//index.js
//获取应用实例
const app = getApp()
const db = wx.cloud.database()

Page({
  data: {
    username: '',
    password: '',
    id: '',
    img: ''
  },
  openXslx() {
    wx.cloud.downloadFile({
      fileID: 'cloud://mysstic-ca0eef.6d79-mysstic-ca0eef-1256866225/工作计划.xlsx',
      success: res => {
        // get temp file path
        console.log(res.tempFilePath)
        wx.openDocument({
          filePath: res.tempFilePath,
          success: function (res) {
            console.log('打开文档成功')
          }
        })
      },
      fail: err => {
        // handle error
      }
    })
  },
  uploadFile() {
    let that = this
    wx.chooseMessageFile({
      count: 10,
      type: 'all',
      success (res) {
        // tempFilePath可以作为img标签的src属性显示图片
        const tempFilePaths = res.tempFiles
        console.log(tempFilePaths)
        wx.cloud.uploadFile({
          cloudPath: tempFilePaths[0].name,
          filePath: tempFilePaths[0].path, // 文件路径
          success: res => {
            // get resource ID
            console.log(res.fileID)
          },
          fail: err => {
            // handle error
          }
        })
      }
    })
  },
  uploadImg() {
    let that = this
    wx.chooseImage({
      count: 1,
      sizeType: ['original', 'compressed'],
      sourceType: ['album', 'camera'],
      success (res) {
        const tempFilePaths = res.tempFilePaths
        wx.cloud.uploadFile({
          cloudPath: new Date().getTime() + '.jpg', // 上传至云端的路径
          filePath: tempFilePaths[0], // 小程序临时文件路径
          success: res => {
            that.setData({
              img: tempFilePaths
            })
            console.log(res.fileID)
          },
          fail: console.error
        })
      }
    })
  },
  updUsername(e) {
    this.setData({
      username: e.detail.value
    })
  },
  updId(e) {
    this.setData({
      id: e.detail.value
    })
  },
  delId(e) {
    console.log(e.detail.value)
    this.setData({
      id: e.detail.value
    })
  },
  addName(e) {
    console.log(e.detail.value)
    this.setData({
      username: e.detail.value
    })
  },
  addPwd(e) {
    console.log(e.detail.value)
    this.setData({
      password: e.detail.value
    })
  },

  add() {
    db.collection('users').add({
      data: {
        useranme: this.data.username,
        password: this.data.password
      },
      success: function() {
        console.log('添加成功')
      }
      
    })
  },
  search() {
    db.collection('users').get({
      success: function(res) {
        console.log('查询成功',res)
      }
    })
  },
  del() {
    db.collection('users').doc(this.data.id).remove({
      success(res) {
        console.log('删除成功', res)
      },
      fail(res) {
        console.log('删除失败', res)
      }
    })
  },
  upd() {
    db.collection('users').doc(this.data.id).update({
      data: {
        username: this.data.username
      },
      success(res) {
        console.log(res, 'update success...')
      },
      fail(res) {
        console.log(res, 'update fail...')
      }
    })
  },
  addFunc() {
    wx.cloud.callFunction({
      name: 'add',
      data: {
        a: 1,
        b: 2
      },
      success(res) {
        console.log('success',res)
      },
      fail(res) {
        console.log('fail')
      }
    })
  },
  getOpenId() {
    wx.cloud.callFunction({
      name: 'getOpenId',
      success(res) {
        console.log('success', res)
      },
      fail(err) {
        console.log(err)
      }
    })
  },
  searchFromSQl() {
    db.collection('users').get({
      success(res) {
        console.log(res)
      },
      fail(err) {
        console.log(err)
      }
    })
  },
  searchFromCloud() {
    wx.cloud.callFunction({
      name: 'getList',
      success(res) {
        console.log(res)
      },
      fail(err) {
        console.log(err)
      }
    })
  }
})

project.config.json

// 要加上 cloudfunctionRoot 云函数文件夹路径配置
{
	"cloudfunctionRoot": "cloud/",
	"description": "项目配置文件",
	"packOptions": {
		"ignore": []
	},
	"setting": {
		"urlCheck": true,
		"es6": true,
		"postcss": true,
		"minified": true,
		"newFeature": true,
		"coverView": true,
		"autoAudits": false,
		"showShadowRootInWxmlPanel": true,
		"scopeDataCheck": false,
		"checkInvalidKey": true,
		"checkSiteMap": true,
		"uploadWithSourceMap": true,
		"babelSetting": {
			"ignore": [],
			"disablePlugins": [],
			"outputPath": ""
		},
		"useCompilerModule": true
	},
	"compileType": "miniprogram",
	"libVersion": "2.11.1",
	"appid": "wxf1f5610935280545",
	"projectname": "haimansi",
	"debugOptions": {
		"hidedInDevtools": []
	},
	"isGameTourist": false,
	"simulatorType": "wechat",
	"simulatorPluginLibVersion": {},
	"condition": {
		"search": {
			"current": -1,
			"list": []
		},
		"conversation": {
			"current": -1,
			"list": []
		},
		"game": {
			"currentL": -1,
			"list": []
		},
		"miniprogram": {
			"current": -1,
			"list": []
		}
	}
}

云函数入口文件 index.js

// 云函数入口文件
const cloud = require('wx-server-sdk')

cloud.init()

// 云函数入口函数
exports.main = async (event, context) => {
	// 具体的业务逻辑
  return await cloud.database().collection('users').get()
}
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章