<template>   // 页面结构，等同 HTML
<script>     // 页面逻辑，等同 JS
<style>      // 页面样式，等同 CSS/LESS

data() {
  return {
    userInfo: {
      avatar: null,
      nickName: null,
      sex: null,
      phonenumber: null
    },
    jumpList: [...], // 页面按钮项配置
    notice: '',      // 公告栏内容
    path: null       // 即将跳转的路径临时变量
  }
}

created() {
  let token = uni.getStorageSync('token')
  if (!token) {
    uni.login({...})
  }
}

onShow() {
  this.getNotice()
  this.userInfo = uni.getStorageSync('userInfo') || {...}
}

methods: {
  getPhoneNumber(e) { ... },
  jumpTo(path, id) { ... },
  getNotice() { ... }
}

用户打开页面
 └── created() 执行（如检测token、准备数据）
 └── 页面渲染 DOM
 └── onShow() 执行（刷新数据、加载公告）
    └── getNotice()
    └── 读取 userInfo
用户操作按钮
 └── jumpTo() 被触发
    └── 判断是否已授权头像、手机号
    └── 未授权 → 请求授权（头像 / 手机号）
    └── 已授权 → 发起接口请求，跳转页面