小程序的学习笔记

小程序的开发笔记
app.js:
初始化云开发,设置开发环境
app.json:
添加页面,第一个为首页。窗口设置样式

添加页面包括4个文件:
js,json,wxml,wxss四个文件
js写函数
json配置页面
wxml写页面
wxss写样式
每添加一个界面需要在app.json注册。

在js下写方法:
1.跳转方法:

MyJump: function(){
    wx.navigateTo({
      url: '../myWork/myWork',
    })
  }

2.打开文件

openFile(){
      wx.cloud.downloadFile({
        fileID: 'cloud://坏境id.docx',
        success:function(res){
          const filepath = res.tempFilePath;
          console.log("12",filepath)
          wx.openDocument({
            filePath: filepath,
            success:function(){
              console.log('打开成功')
            }
          })
        }
      })
  }

3.直接查询数据库,有数据限制

const db = wx.cloud.database()
    db.collection('my_work_user').get({
      success: res => {
        this.setData({
          infoData: JSON.stringify(res.data, null, 2)
        })
        console.log('[数据库] [查询记录] 成功: ', res)
      },
      fail: err => {
        wx.showToast({
          icon: 'none',
          title: '查询记录失败'
        })
        console.error('[数据库] [查询记录] 失败:', err)
      }
    });

4.云函数,最好通过云函数调用云数据库。创建方式:右键新建note.js云函数文件名即为函数名

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

cloud.init()

// 云函数入口函数
exports.main = async (event, context) => {
  let a = event.a;
  let b = event.b;
  return a+b;
}

调用云函数:

getSum(){

    var that = this;
    wx.cloud.callFunction({
      name:'addInfo',
      data:{
        a :1,
        b :2
      },
      success(res){
        console.log('云函数成功: ', res);
        that.setData({
          sum : res.result
        })
        
      },fail(res){
          wx.showToast({
            title: '错误',
          })
      }
    })
  }

5.选择并上传图片:

uploadImage(){
    let that = this;
    wx.chooseImage({
      count: 1,
      sizeType: ['original', 'compressed'],
      sourceType: ['album', 'camera'],
      success (res) {
      // tempFilePath可以作为img标签的src属性显示图片
      const tempFilePaths = res.tempFilePaths
      that.uping(tempFilePaths[0])
      }
    })
  },
  uping(fileTempPath){
    wx.cloud.uploadFile({
      cloudPath: 'haha222.png',
      filePath: fileTempPath, // 文件路径
      success: res => {
        // get resource ID
        console.log(res.fileID)
      },
      fail: err => {
        // handle error
      }
    })
  }

6.获取外部链接:

getOther(){
    var that = this;
    wx.request({
      
      url: 'https://域名/m/test', //仅为示例,并非真实的接口地址
      data: {
      },
      header: {
        'content-type': 'application/json' // 默认值
      },
      success (res) {
        console.log(res.data)
        that.setData({
          otherInfo:res.data
        })
      }
    })
  }
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 1.小程序起步 (1)点击https://mp.weixin.qq.com/wxopen/waregister?a...
    GXW_Lyon阅读 3,409评论 0 0
  • 第一章 什么是微信小程序 1. 小程序介绍 微信小程序是一种全新的连接用户与服务的方式,它可以在微信内被便捷地获取...
    呆毛和二货阅读 856评论 0 1
  • 因新工作主要负责微信小程序这一块,最近的重心就移到这一块,该博客是对微信小程序整体的整理归纳以及标明一些细节点,初...
    majun00阅读 7,392评论 0 9
  • 每天的学习记录,可能有的地方写的不对,因为刚学,以后发现错的话会回来改掉整体流程 https://develope...
    有点健忘阅读 4,753评论 0 7
  • 没有人的时候我学会了竖起硬刺保护自己——题记 工作火急火燎的展开了。张国庆带我熟悉了一天市场后,施长让我继续和陈衫...
    林小仙仙仙阅读 163评论 0 9