From dbe3e67dfe809df030a6f079f747ddd5b86e333d Mon Sep 17 00:00:00 2001
From: feige996 <1020102647@qq.com>
Date: Thu, 28 Aug 2025 16:05:25 +0800
Subject: [PATCH] =?UTF-8?q?refactor(pages):=20=E5=B0=86=E9=A1=B5=E9=9D=A2?=
 =?UTF-8?q?=E9=85=8D=E7=BD=AE=E4=BB=8Eroute=E6=A0=87=E7=AD=BE=E8=BF=81?=
 =?UTF-8?q?=E7=A7=BB=E5=88=B0definePage=E5=AE=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

统一使用definePage宏配置页面样式和类型，移除冗余的route标签
更新vscode代码片段模板以匹配新的配置方式
简化pages.json中的页面配置
---
 .vscode/vue3.code-snippets    | 14 +++++---------
 src/pages-sub/demo/index.vue  | 15 ++++++---------
 src/pages.json                |  9 ++-------
 src/pages/about/about.vue     | 19 +++++--------------
 src/pages/about/alova.vue     | 15 ++++++---------
 src/pages/about/vue-query.vue | 15 ++++++---------
 src/pages/index/index.vue     | 20 +++++++++-----------
 src/pages/login/login.vue     | 15 ++++++---------
 src/pages/login/register.vue  | 15 ++++++---------
 src/pages/me/me.vue           | 16 ++++++----------
 10 files changed, 57 insertions(+), 96 deletions(-)

diff --git a/.vscode/vue3.code-snippets b/.vscode/vue3.code-snippets
index a196e90..8c69a4e 100644
--- a/.vscode/vue3.code-snippets
+++ b/.vscode/vue3.code-snippets
@@ -19,16 +19,12 @@
     "scope": "vue",
     "prefix": "v3",
     "body": [
-      "<route lang=\"jsonc\" type=\"page\">",
-      "{",
-      "  \"layout\": \"default\",",
-      "  \"style\": {",
-      "    \"navigationBarTitleText\": \"$1\"",
-      "  }",
-      "}",
-      "</route>\n",
       "<script lang=\"ts\" setup>",
-      "//$2",
+      "definePage({",
+      "  style: {",
+      "    navigationBarTitleText: '$1',",
+      "  },",
+      "})",
       "</script>\n",
       "<template>",
       "  <view class=\"\">$3</view>",
diff --git a/src/pages-sub/demo/index.vue b/src/pages-sub/demo/index.vue
index 1d6abdd..bffc26f 100644
--- a/src/pages-sub/demo/index.vue
+++ b/src/pages-sub/demo/index.vue
@@ -1,15 +1,12 @@
-<route lang="jsonc" type="page">
-{
-  "layout": "default",
-  "style": {
-    "navigationBarTitleText": "分包页面"
-  }
-}
-</route>
-
 <script lang="ts" setup>
 // code here
 import RequestComp from './components/request.vue'
+
+definePage({
+  style: {
+    navigationBarTitleText: '分包页面',
+  },
+})
 </script>
 
 <template>
diff --git a/src/pages.json b/src/pages.json
index da4336c..e80d2f9 100644
--- a/src/pages.json
+++ b/src/pages.json
@@ -58,23 +58,20 @@
     {
       "path": "pages/about/alova",
       "type": "page",
-      "layout": "default",
       "style": {
-        "navigationBarTitleText": "Alova 请求演示"
+        "navigationBarTitleText": "Alova 演示"
       }
     },
     {
       "path": "pages/about/vue-query",
       "type": "page",
-      "layout": "default",
       "style": {
-        "navigationBarTitleText": "Vue Query 请求演示"
+        "navigationBarTitleText": "Vue Query 演示"
       }
     },
     {
       "path": "pages/login/login",
       "type": "page",
-      "layout": "default",
       "style": {
         "navigationBarTitleText": "登录"
       }
@@ -82,7 +79,6 @@
     {
       "path": "pages/login/register",
       "type": "page",
-      "layout": "default",
       "style": {
         "navigationBarTitleText": "注册"
       }
@@ -102,7 +98,6 @@
         {
           "path": "demo/index",
           "type": "page",
-          "layout": "default",
           "style": {
             "navigationBarTitleText": "分包页面"
           }
diff --git a/src/pages/about/about.vue b/src/pages/about/about.vue
index d05ffff..6c08d73 100644
--- a/src/pages/about/about.vue
+++ b/src/pages/about/about.vue
@@ -1,23 +1,14 @@
-<route lang="jsonc" type="page">
-{
-  "style": {
-    "navigationBarTitleText": "关于"
-  }
-}
-</route>
-
 <script lang="ts" setup>
 import { LOGIN_PAGE } from '@/router/config'
 import { tabbarStore } from '@/tabbar/store'
 import RequestComp from './components/request.vue'
 import VBindCss from './components/VBindCss.vue'
 
-// 奇怪：同样的代码放在 vue 里面不会校验到错误，放在 .ts 文件里面会校验到错误
-// const testOxlint = (name: string) => {
-//   console.log('oxlint')
-// }
-// testOxlint('oxlint')
-console.log('about')
+definePage({
+  style: {
+    navigationBarTitleText: '关于',
+  },
+})
 
 function toLogin() {
   uni.navigateTo({
diff --git a/src/pages/about/alova.vue b/src/pages/about/alova.vue
index 70c3af3..4b0c43f 100644
--- a/src/pages/about/alova.vue
+++ b/src/pages/about/alova.vue
@@ -1,16 +1,13 @@
-<route lang="jsonc" type="page">
-{
-  "layout": "default",
-  "style": {
-    "navigationBarTitleText": "Alova 请求演示"
-  }
-}
-</route>
-
 <script lang="ts" setup>
 import { useRequest } from 'alova/client'
 import { foo } from '@/api/foo-alova'
 
+definePage({
+  style: {
+    navigationBarTitleText: 'Alova 演示',
+  },
+})
+
 const initialData = undefined
 
 const { loading, data, send } = useRequest(foo, {
diff --git a/src/pages/about/vue-query.vue b/src/pages/about/vue-query.vue
index cea85c9..6ffa94d 100644
--- a/src/pages/about/vue-query.vue
+++ b/src/pages/about/vue-query.vue
@@ -1,17 +1,14 @@
-<route lang="jsonc" type="page">
-{
-  "layout": "default",
-  "style": {
-    "navigationBarTitleText": "Vue Query 请求演示"
-  }
-}
-</route>
-
 <script lang="ts" setup>
 import { useQuery } from '@tanstack/vue-query'
 import { foo } from '@/api/foo'
 import { getFooQueryOptions } from '@/api/foo-vue-query'
 
+definePage({
+  style: {
+    navigationBarTitleText: 'Vue Query 演示',
+  },
+})
+
 // 简单使用
 onShow(async () => {
   const res = await foo()
diff --git a/src/pages/index/index.vue b/src/pages/index/index.vue
index b48d454..6aeb968 100644
--- a/src/pages/index/index.vue
+++ b/src/pages/index/index.vue
@@ -1,14 +1,3 @@
-<!-- 使用 type="home" 属性设置首页，其他页面不需要设置，默认为page -->
-<route lang="jsonc" type="home">
-{
-  "style": {
-    // 'custom' 表示开启自定义导航栏，默认 'default'
-    "navigationStyle": "custom",
-    "navigationBarTitleText": "首页"
-  }
-}
-</route>
-
 <script lang="ts" setup>
 import { LOGIN_PAGE } from '@/router/config'
 import { useThemeStore } from '@/store'
@@ -16,6 +5,15 @@ import { useThemeStore } from '@/store'
 defineOptions({
   name: 'Home',
 })
+definePage({
+  // 使用 type: "home" 属性设置首页，其他页面不需要设置，默认为page
+  type: 'home',
+  style: {
+    // 'custom' 表示开启自定义导航栏，默认 'default'
+    navigationStyle: 'custom',
+    navigationBarTitleText: '首页',
+  },
+})
 
 const themeStore = useThemeStore()
 
diff --git a/src/pages/login/login.vue b/src/pages/login/login.vue
index cf2c880..6e7ef45 100644
--- a/src/pages/login/login.vue
+++ b/src/pages/login/login.vue
@@ -1,12 +1,3 @@
-<route lang="jsonc" type="page">
-{
-  "layout": "default",
-  "style": {
-    "navigationBarTitleText": "登录"
-  }
-}
-</route>
-
 <script lang="ts" setup>
 import { useUserStore } from '@/store/user'
 import { tabbarList } from '@/tabbar/config'
@@ -14,6 +5,12 @@ import { isPageTabbar } from '@/tabbar/store'
 import { ensureDecodeURIComponent } from '@/utils'
 import { parseUrlToObj } from '@/utils/index'
 
+definePage({
+  style: {
+    navigationBarTitleText: '登录',
+  },
+})
+
 const redirectUrl = ref('')
 onLoad((options) => {
   console.log('login options: ', options)
diff --git a/src/pages/login/register.vue b/src/pages/login/register.vue
index 636fb6b..e9809f0 100644
--- a/src/pages/login/register.vue
+++ b/src/pages/login/register.vue
@@ -1,15 +1,12 @@
-<route lang="jsonc" type="page">
-{
-  "layout": "default",
-  "style": {
-    "navigationBarTitleText": "注册"
-  }
-}
-</route>
-
 <script lang="ts" setup>
 import { LOGIN_PAGE } from '@/router/config'
 
+definePage({
+  style: {
+    navigationBarTitleText: '注册',
+  },
+})
+
 function doRegister() {
   uni.showToast({
     title: '注册成功',
diff --git a/src/pages/me/me.vue b/src/pages/me/me.vue
index 5dadfc6..b668680 100644
--- a/src/pages/me/me.vue
+++ b/src/pages/me/me.vue
@@ -1,13 +1,3 @@
-<route lang="jsonc" type="page">
-{
-  "style": {
-    // 'custom' 表示开启自定义导航栏，默认 'default'
-    // "navigationStyle": "custom",
-    "navigationBarTitleText": "我的"
-  }
-}
-</route>
-
 <script lang="ts" setup>
 import type { IUploadSuccessInfo } from '@/api/types/login'
 import { storeToRefs } from 'pinia'
@@ -16,6 +6,12 @@ import { useUserStore } from '@/store'
 import { useTokenStore } from '@/store/token'
 import { useUpload } from '@/utils/uploadFile'
 
+definePage({
+  style: {
+    navigationBarTitleText: '我的',
+  },
+})
+
 const userStore = useUserStore()
 const tokenStore = useTokenStore()
 // 使用storeToRefs解构userInfo