小程序模板网

微信小程序 使用LeanCloud(一)前端使用

发布时间:2017-12-21 10:08 所属栏目:小程序开发教程

首先声明一下,自己搞这个小程序,但是对这个后台几乎是渣渣,所以后台基本依赖别人。而今天偶然看别人写的Demo中用到了这个东西,很是好奇,后台很容易就能实现。缺点:1,价格真TM贵,LeanCloud云引擎最低配30元/ ...

 
 
 

首先声明一下,自己搞这个小程序,但是对这个后台几乎是渣渣,所以后台基本依赖别人。 
而今天偶然看别人写的Demo中用到了这个东西,很是好奇,后台很容易就能实现。 
缺点: 
1,价格真TM贵,LeanCloud云引擎最低配30元/月, 
2,后台放在别人服务器上,哪天挂了找谁去啊, 
3,而且那点小秘密都被别人看见了。。。 
优点: 
1,快速开发, 
2,(借用郭德纲的一句话),恩~~会有的

好了,用不用自己看着来吧,不用的话,文章底部,点个赞再走吧,么么哒

——————————————–华丽的分割线——————————————– 
官方文档地址:https://leancloud.cn/docs/weapp.html 
1.下载SDK。 
2.如果你下一步是要发布小程序了,别忘了把用到的域名添加上,https://leancloud.cn/docs/weapp-domains.html。 
3.安装初始化:

在 app.js 中使用 
const AV = require('./libs/av-weapp-min.js');
// LeanCloud 应用的 ID 和 Key
AV.init({ 
 appId: 'e6FRGuyy23GkkrQeAPuW3ONJ-gzGzoHsz', 
 appKey: '13oC4vlWkXpyiGVTLCArSpLe', 
});
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7

**

4.数据绑定

**  4.1:首先需要创建一个对象类,也就是你数据库里的表

const App = getApp()
// Todo类继承AV.Object父类
class Todo extends App.AV.Object {
  // 字段的get set方法
  get content() { return this.get('content') }
  set content(value) { return this.set('content', value) }

  get done() { return this.get('done') }
  set done(value) { return this.set('done', value) }
}
// 将Todo在AV中注册
App.AV.Object.register(Todo)
// 公布你的Todo
module.exports = Todo;
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14

4.2在index.js中如何操作

//index.js
//获取应用实例
var App = getApp()
const Todo = require("../../model/todo");

Page({
  addTodoFun() {
    new Todo({
      content: this.data.myData,
      done: false
    }).save()
      .then(console.log)
      .catch(console.error);
  }
})
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15

5.读取整张表

new App.AV
  .Query('Todo')
  .find().then(data => this.setData({ todoList: data }))
  .catch(console.error)
  • 1
  • 2
  • 3
  • 4
  • 1
  • 2
  • 3
  • 4

6.一键登录

// LeanCloud 的用户系统现已支持一键使用微信用户身份登录。  // 要使用一键登录功能,需要先设置小程序的 AppID 与 AppSecret:  // 如果该用户是第一次使用此应用,调用登录 API 会创建一个新的用户  // 同一个用户再次调用登录 loginWithWeapp() 会返回同一个用户。  // 用户的登录状态会保存在客户端中

// 支持一键使用微信用户身份登录,信息并不完整
App.AV.User.loginWithWeapp()
.then(user => console.log(user.toJSON()))
.catch(console.error)
// 获取本地当前用户信息 
const user = App.AV.User.current()
// 更新用户信息
wx.getUserInfo({
  success(userInfo) {
    // 更新当前用户的信息
    user.set(userInfo)
      .save()
      .then(user => console.log(user.toJSON()))
      .catch(console.error)
  }
})
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16

7.启用其他登录方式

// 小程序登录
AV.User.loginWithWeapp().then(user => {
  // 设置并保存手机号
  user.setMobilePhoneNumber('13000000000');
  return user.save();
}).then(user => {
  // 发送验证短信
  return AV.User.requestMobilePhoneVerify(user.getMobilePhoneNumber());
}).then({
  // 用户填写收到短信验证码后再调用 AV.User.verifyMobilePhone(code) 完成手机号的绑定
  // 成功后用户的 mobilePhoneVerified 字段会被置为 true
  // 此后用户便可以使用手机号加动态验证码登录了
}).catch(console.error);
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13

8.文件存储

wx.chooseImage({
  count: 1,// 最多可以选择的图片张数,默认9
  sizeType: ['original', 'compressed'], //  original 原图,compressed 压缩图,默认二者都有
  sourceType: ['album', 'camera'],  //  album 从相册选图,camera 使用相机,默认二者都有
  success: function (res) {
    // 图片地址
    var tempFilePath = res.tempFilePaths[0];
    // 保存图片
    new App.AV
      .File('file-name', {  //  图片名
        blob: { uri: tempFilePath, }, //  就是uri 不是url
      })
      .save()
      .then(file => console.log(file.url()))  //  返回服务器图片地址
      .catch(console.error);
  }
});
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17

9.绑定现有客户

// 首先,使用用户名与密码登录一个已经存在的用户
AV.User.logIn('username', 'password').then(user => {
  // 将当前的微信用户与当前登录用户关联
  return user.linkWithWeapp();
}).catch(console.error);


易优小程序(企业版)+灵活api+前后代码开源 码云仓库:starfork
本文地址:https://www.eyoucms.com/wxmini/doc/course/18219.html 复制链接 如需定制请联系易优客服咨询:800182392 点击咨询
QQ在线咨询