1 新建页面

进入编辑器，在组件页面区域点击+号，创建我的页面
在这里插入图片描述

2 未登录页面开发

我的页面的逻辑是如果用户未注册，那么显示注册按钮，要求用户注册。如果用户已经注册，则显示我的预约菜单

往页面放入网格布局，修改列数量为2
在这里插入图片描述
选中第一列，修改列宽度为手动调节，我们让列宽占到4

然后往列里放入普通容器，普通容器里放入图片组件

在未登录之前，我们给图片一个默认的头像图片，从素材库选择一个默认登录的图片

设置图片的布局模式为裁剪填满，修改图片的宽和高
在这里插入图片描述
设置普通容器为居中对齐

设置15像素的内边距

第二列增加一个普通容器，里边放一个文本组件，修改文本内容为未注册

设置普通容器的宽和高为100%，布局为横向排列，左对齐，垂直居中对齐

网格布局下放置一个普通容器，设置为灰色的背景，高度为8Px
在这里插入图片描述
下边放置一个普通容器，里边放置一个按钮组件

设置按钮的宽度为90%

设置普通容器为居中对齐，外边距为100

3 控制未登录显示

页面搭建好之后，我们就需要判断什么状态下用户是未注册。我们先定义一个变量来表示用户信息
在这里插入图片描述
默认值我们自己初始化一下

{"_id":""}

当用户启动小程序的时候我们需要在生命周期函数里去加载一下信息，逻辑是根据当前用户的openid来去数据源查询，如果找到数据说明用户已经注册了，如果未找到数据说明用户未注册

如果需要存储信息，我们先需要新建一个数据源，字段包含三个，昵称、头像、openid

在控制台点击新建数据模型，将三个字段都建立好

在这里插入图片描述

数据源创建好之后，就在全局生命周期函数里加载用户信息

export default {
  async onAppLaunch(launchOpts) {
    //console.log('---------> LifeCycle onAppLaunch', launchOpts)
    //$app.auth.currentUser.openId = "o29js5TnCwiYJayG9AieKzkIlOBg"
    const userInfo  = await $app.auth.getUserInfo();

    console.log(userInfo)

    const result = await app.cloud.callModel({
      name:'yhxx_5wybupo',
      methodName:'wedaGetRecords',
      params:{
        pageNo:1,
        pageSize:1,
        where:[
          {
            key:"openid",
            rel:"eq",
            val:userInfo.openId
          }
        ]
      }
    })
    console.log(userInfo.openId)
    console.log(result)
    if(result.total>0){
      $app.dataset.state.user = result.records[0]
      /*app.navigateTo({
        pageId:"index",
        params:{}
      })*/
    }else{
      /*app.navigateTo({
        pageId:"u_jiao_se_xuan_ze",
        params:{}
      })*/
    }
  },
  onAppShow(appShowOpts) {
    //console.log('---------> LifeCycle onAppShow', appShowOpts)
  },
  onAppHide() {
    //console.log('---------> LifeCycle onAppHide')
  },
  onAppError(options) {
    //console.log('---------> LifeCycle onAppError', options)
  },
  onAppPageNotFound(options) {
    //console.log('---------> LifeCycle onAppPageNotFound', options)
  },
  onAppUnhandledRejection(options) {
    //console.log('---------> LifeCycle onAppUnhandledRejection', options)
  }
}