实现功能
目标列表; 添加目标; 删除目标; 置顶目标; 目标模板; 设置主题;
创建项目
开通云环境
创建数据库
项目结构
初始化云环境
//app.js
App({
onLaunch: function () {
var me = this;
if (!wx.cloud) {
console.error('请使用 2.2.3 或以上的基础库以使用云能力' )
} else {
wx.cloud.init({
traceUser: true ,
})
}
me.globalData = { }
}
})
复制代码
获取openid
//pages/index/index.js
onLoad: function (options) {
wx.cloud.callFunction({
name: 'login' ,
data: {},
success: res => {
app.globalData.openid = res.result.openid
},
fail: err => {
}
})
}
复制代码
获取目标列表
//pages/goallist/goallist.js
getGoals: function (){
const me = this;
const db = wx.cloud.database();
wx.showLoading({
title: '努力加载中...' ,
mask: true
})
db.collection('goals' ).orderBy('toptime' ,'desc' ).orderBy('date' ,'desc' ).where({
_openid: app.globalData.openid
}).get({
success: res => {
var goals = res.data.map(function (item,index){
item.date = util.formatTime(item.date)
return item;
})
var isShowAdd = res.data.length < me.data.max; //最多添加15条目标
this.setData({
goals: goals,
isShowAdd: isShowAdd,
isLoaded: true
})
},
fail: err => {
},
complete: res => {
wx.hideLoading()
}
})
},
复制代码
添加目标
//pages/goaladd/goaladd.js
do FormSubmit: function (e){
var goal = e.detail.value.goal;
const db = wx.cloud.database()
db.collection('goals' ).add({
data: {
openid: app.globalData.openid,
goal: goal,
date: new Date(),
status: 1
},
success: res => {
// 在返回结果中会包含新创建的记录的 _id
wx.showToast({
title: '创建成功' ,
success: function (){
wx.navigateTo({
url: '/pages/goallist/goallist'
})
}
});
},
fail: err => {
wx.showToast({
icon: 'none' ,
title: '创建失败'
})
}
})
},
复制代码
删除目标
//pages/goallist/goalist.js
do GoalDelete: function (e){
var me = this;
var id = e.currentTarget.dataset.id;
const db = wx.cloud.database()
db.collection('goals' ).doc(id).remove({
success: res => {
wx.showToast({
title: '删除成功' ,
success: function (){
set Timeout(function (){
me.getGoals();
},500)
}
})
},
fail: err => {
wx.showToast({
icon: 'none' ,
title: '删除失败' ,
})
}
})
},
复制代码
置顶目标
do GoalTop: function (e){
var me = this;
var id = e.currentTarget.dataset.id;
const db = wx.cloud.database()
db.collection('goals' ).doc(id).update({
data:{
istop: true ,
toptime: new Date()
},
success: res => {
wx.showToast({
title: '置顶成功' ,
success: function (){
set Timeout(function (){
me.getGoals();
},500)
}
})
},
fail: err => {
wx.showToast({
icon: 'none' ,
title: '置顶失败' ,
})
}
})
},
复制代码
设置主题
//pages/goallist/goallist.js
onThemeChange: function (e){
const theme = e.detail.value;
try {
wx.setStorageSync('theme' , theme)
this.updateTheme(theme)
} catch (e) { }
},
getTheme: function (){
try {
const theme = wx.getStorageSync('theme' ) || '#c8e6c9'
this.updateTheme(theme)
} catch (e) { }
},
updateTheme: function (theme){
var themes = this.data.themes;
themes.map(function (item,index){
if (item.value === theme){
item.checked = true ;
}else {
item.checked = false ;
}
return item;
})
this.setData({
theme: theme,
themes: themes,
isShowSettings: false
})
wx.setNavigationBarColor({
frontColor: '#ffffff' ,
backgroundColor: theme,
animation: {
duration: 400,
timingFunc: 'easeIn'
}
})
},
复制代码
项目源码
源码