本科课程作业写了个基础的小程序在这里记录分享一下，如有错误欢迎指出。

判断是否登录隐藏按钮

一开始写好登录注册发现，当我登录成功后个人中心页面还保留着登录注册按钮，于是翻阅了微信小程序开发文档查找如何隐藏按钮的方法。
在微信官方的开发文档中找到条件渲染语句的用法：

然后考虑到隐藏和显示包含了多个view，所以用block来承载这个条件渲染：

wxml代码

<scroll-view scroll-y class="scrollPage">
<view class="UCenter-bg">
<block wx:if="{{id}}">//判断条件 id是否为空
<image src="{{userimg}}" class="png" mode="widthFix" bindtap="userimgsc"></image>
<view class="margin-top-sm">
<text>欢迎回来,{{username}}!</text>
</view>
</block>
<block wx:else>//id为空则显示登录注册按钮
<button bindtap='signzhuan' class="button">注册</button>
<button bindtap='loginzhuan' class="button">登录</button>
</block>
<image src="https://raw.githubusercontent.com/weilanwl/ColorUI/master/demo/images/wave.gif" mode="scaleToFill" class="gif-wave"></image>
</view>
<view class="cu-list menu card-menu margin-top-xl margin-bottom-xl shadow-lg radius">

<view class="cu-item arrow">
<view class="content" bindtap="shoucangjia">
<text class="cuIcon-writefill text-cyan"></text>
<text class="text-grey">我的收藏</text>
</view>
</view>

<view class="cu-item arrow">
<view class="content" bindtap="wdsc">
<text class="cuIcon-formfill text-green"></text>
<text class="text-grey">我的上传</text>
</view>
</view>

<view class="cu-item arrow">
<view class="content" bindtap="photostop">
<text class="cuIcon-creativefill text-orange"></text>
<text class="text-grey">上传图片</text>
</view>
</view>
<view class="cu-tabbar-height"></view>
</scroll-view>

wxss用的colorUI

js代码

登陆成功后会将该用户的openid传入全局变量，根据全局变量中的该字段判断用户是否登录。

1. 在app.js中加入新字段

this.globalData = {
nowuseropid:null
}

1. 在登录的js中加入传入变量代码（该段代码加入到登录成功的条件下）

app.globalData.nowuseropid = app.globalData.openid

1. 在个人中心的js中利用openid在用户集合中查询该用户的用户名、头像信息

const app = getApp()
const db = wx.cloud.database({   //引用云数据库
env: '云开发环境名'			//云开发环境ID
});
const 自己起的名userListDB = db.collection('集合名');
Page({

/**
* 页面的初始数据
*/
data: {
},

/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
let that = this;
console.log('id', app.globalData.nowuseropid)
this.setData({
id:app.globalData.nowuseropid//传入视图层 判断是否登录
})
if(app.globalData.nowuseropid!=null){//进行判断 不为空则进行查询
userListDB.where({
_openid:app.globalData.nowuseropid
}).get({
success: function (res){
that.setData({
username:res.data[0].name,
userimg:res.data[0].userimg
})
console.log('姓名',res.data[0].name)
console.log('图片',res.data[0].userimg)
}
})
}
},
signzhuan() {//注册按钮
wx.navigateTo({
url: '/pages/sign/sign',
})
},
loginzhuan() {//登录按钮
wx.navigateTo({
url: '/pages/login/login',
})
},
photostop(){//上传按钮
let that = this;
if(that.data.username==null){
wx.showModal({
title: '提示',
content: '请先登录！',
success: function (res) {
if (res.confirm) {
console.log('用户点击确定')
that.loginzhuan();
}
}
})
}else{
wx.navigateTo({//跳转上传界面
url: '/pages/sc/sc',
})
}

},
wdsc(){//查看我的上传按钮
let that = this;
if(that.data.username==null){
wx.showModal({
title: '提示',
content: '请先登录！',
success: function (res) {
if (res.confirm) {
console.log('用户点击确定')
that.loginzhuan();
}
}
})
}else{
wx.navigateTo({//跳转我的上传页面
url: '/pages/wdsc/wdsc',
})
}

},
shoucangjia(){//查看收藏夹按钮
let that = this;
if(that.data.username==null){
wx.showModal({
title: '提示',
content: '请先登录！',
success: function (res) {
if (res.confirm) {
console.log('用户点击确定')
that.loginzhuan();
}
}
})
}else{
wx.navigateTo({//跳转收藏夹界面
url: '/pages/shoucangjia/shoucangjia',
})
}
},
})