@wot-ui/router 1.0.0 → 1.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/README.md +55 -0
  2. package/dist/index.cjs +42 -8
  3. package/dist/index.d.cts +235 -2
  4. package/dist/index.d.mts +235 -2
  5. package/dist/index.mjs +43 -9
  6. package/package.json +1 -1
package/README.md ADDED
@@ -0,0 +1,55 @@
1
+ <p align="center">
2
+ <img alt="logo" src="https://my-uni.wot-ui.cn/logo.svg" width="200">
3
+ </p>
4
+
5
+ <h1 align="center">
6
+ My Uni
7
+ </h1>
8
+
9
+ <p align="center">专为 uni-app 开发的摸鱼插件库，包含路由、CI/CD 等插件，助你轻松工作，天天摸鱼！</p>
10
+
11
+ <p align="center">
12
+ <a href="https://my-uni.wot-ui.cn/guide/introduction">📖 快速开始</a>
13
+ <a href="https://my-uni.wot-ui.cn/demo/#/">📱 查看演示</a>
14
+ <a href="https://blog.wot-ui.cn/about">👤 关于作者</a>
15
+ </p>
16
+
17
+ ## 特性
18
+
19
+ - 🚀 **多平台覆盖** - 支持 APP、H5、微信小程序 等平台
20
+
21
+ - 💪 **支持 TypeScript** - 使用 Typescript 构建，提供良好的组件类型系统
22
+
23
+ - 🆒 **改善 uni-app 开发体验** - 基于 uni-app 能力，对标 web 流行技术栈，提供近似的开发体验
24
+
25
+ - 🚦 **Router** - 基于 uni-app 路由能力，提供近似的路由体验
26
+
27
+ - 🔄 **CI/CD** - 基于小程序生态持续集成能力，提供与 web 近似的 CI/CD 体验
28
+
29
+ ## 快速上手
30
+
31
+ 详细说明见 [快速开始](https://my-uni.wot-ui.cn/guide/introduction)。
32
+
33
+ ## 更新日志
34
+
35
+ 详细日志见 [更新日志](./CHANGELOG.md)。
36
+
37
+ ## 周边生态
38
+
39
+ | 项目 | 描述 |
40
+ | --- | --- |
41
+ | [wot-ui](https://wot-ui.cn/) | 基于 Vue3 + TypeScript 的 uni-app 组件库 |
42
+ | [wot-starter](https://starter.wot-ui.cn/) | 基于 [vitesse-uni-app](https://github.com/uni-helper/vitesse-uni-app) 的 wot-ui 快速起手项目 |
43
+ | [uni-helper](https://uni-helper.js.org/) | 旨在增强 uni-app 系列产品的开发体验的工具库 |
44
+ | [uni-ku](https://uni-ku.js.org/) | 非常酷的 uni-app 插件库 |
45
+ | [uni-echarts](https://uni-echarts.xiaohe.ink/) | 适用于 uni-app 的 Apache ECharts 组件 |
46
+
47
+ ## 开源协议
48
+
49
+ 本项目基于 [MIT](https://zh.wikipedia.org/wiki/MIT%E8%A8%B1%E5%8F%AF%E8%AD%89) 协议，请自由地享受和参与开源。
50
+
51
+ ## 支持本项目
52
+
53
+ 如果您认为 My Uni 帮助到了您的开发工作，欢迎支持本项目的研发工作。
54
+
55
+ <a href="https://wot-ui.cn/reward/reward">https://wot-ui.cn/reward/reward</a>
package/dist/index.cjs CHANGED
@@ -8,7 +8,8 @@ const START_LOCATION_NORMALIZED = {
8
8
  query: {},
9
9
  hash: "",
10
10
  fullPath: "/",
11
- meta: {}
11
+ meta: {},
12
+ style: {}
12
13
  };
13
14
 
14
15
  //#endregion
@@ -57,8 +58,8 @@ function normalizeUrl(url) {
57
58
 
58
59
  //#endregion
59
60
  //#region src/router.ts
60
- const routerKey = Symbol("router");
61
- const routeKey = Symbol("route");
61
+ const routerKey = Symbol("__ROUTER__");
62
+ const routeKey = Symbol("__ROUTE__");
62
63
  function createRouter(options) {
63
64
  const currentRoute = (0, vue.shallowRef)(START_LOCATION_NORMALIZED);
64
65
  const routes = options.routes || [];
@@ -78,7 +79,15 @@ function createRouter(options) {
78
79
  query: finalQuery,
79
80
  hash: to.hash || "",
80
81
  fullPath: stringifyQuery(path, finalQuery),
81
- meta: route.meta || {}
82
+ meta: route.meta || {},
83
+ style: route.style || {},
84
+ ...Object.fromEntries(Object.entries(route).filter(([key]) => ![
85
+ "path",
86
+ "name",
87
+ "meta",
88
+ "style",
89
+ "aliasPath"
90
+ ].includes(key)))
82
91
  };
83
92
  }
84
93
  if (to.path) return resolvePath(to.path, to.query);
@@ -99,7 +108,15 @@ function createRouter(options) {
99
108
  query: finalQuery,
100
109
  hash: "",
101
110
  fullPath: stringifyQuery(normalizedPath, finalQuery),
102
- meta: route?.meta || {}
111
+ meta: route?.meta || {},
112
+ style: route?.style || {},
113
+ ...Object.fromEntries(Object.entries(route || {}).filter(([key]) => ![
114
+ "path",
115
+ "name",
116
+ "meta",
117
+ "style",
118
+ "aliasPath"
119
+ ].includes(key)))
103
120
  };
104
121
  }
105
122
  function fillParams(path, params) {
@@ -278,7 +295,15 @@ function createRouter(options) {
278
295
  params: {},
279
296
  query: q,
280
297
  hash: "",
281
- fullPath: fullPath.startsWith("/") ? fullPath : `/${fullPath}`
298
+ fullPath: fullPath.startsWith("/") ? fullPath : `/${fullPath}`,
299
+ style: matched?.style || {},
300
+ ...Object.fromEntries(Object.entries(matched || {}).filter(([key]) => ![
301
+ "path",
302
+ "name",
303
+ "meta",
304
+ "style",
305
+ "aliasPath"
306
+ ].includes(key)))
282
307
  };
283
308
  router$1.currentRoute.value = to;
284
309
  afterGuards$1?.forEach((guard) => guard(to, from));
@@ -302,10 +327,19 @@ function createRouter(options) {
302
327
  //#endregion
303
328
  //#region src/index.ts
304
329
  function useRouter() {
305
- return (0, vue.inject)(routerKey);
330
+ const router = (0, vue.inject)(routerKey);
331
+ if (router) return router;
332
+ else throw new Error("useRouter 只可以在 Vue 上下文中使用，请确保你已经正确地注册了 \"uni-mini-router\" 并且当前正处于 Vue 上下文中");
306
333
  }
307
334
  function useRoute() {
308
- return (0, vue.inject)(routeKey);
335
+ const currentRoute = (0, vue.inject)(routeKey);
336
+ if (currentRoute) {
337
+ const route = (0, vue.reactive)(currentRoute.value);
338
+ (0, vue.watch)(currentRoute, (to) => {
339
+ Object.assign(route, to);
340
+ });
341
+ return route;
342
+ } else throw new Error("useRoute 只可以在 Vue 上下文中使用，请确保你已经正确地注册了 \"uni-mini-router\" 并且当前正处于 Vue 上下文中");
309
343
  }
310
344
 
311
345
  //#endregion
package/dist/index.d.cts CHANGED
@@ -5,6 +5,11 @@ type RouteParams = Record<string, string | string[]>;
5
5
  type LocationQuery = Record<string, string | null | (string | null)[]>;
6
6
  type RouteMeta = Record<string | number | symbol, unknown>;
7
7
  type AnimationType = 'auto' | 'none' | 'slide-out-right' | 'slide-out-left' | 'slide-out-top' | 'slide-out-bottom' | 'fade-out' | 'zoom-in' | 'zoom-fade-in' | 'pop-out';
8
+ type RGBAColor = `rgba(${number}, ${number}, ${number}, ${number})`;
9
+ type HEXColor = `#${string}`;
10
+ type PxSize = `${number}px`;
11
+ type PercentageSize = `${number}%`;
12
+ type ThemeVar = `@${string}`;
8
13
  interface RouteLocationBase {
9
14
  animationType?: AnimationType;
10
15
  animationDuration?: number;
@@ -16,18 +21,246 @@ interface RouteRecordRaw {
16
21
  path: string;
17
22
  name?: string;
18
23
  meta?: RouteMeta;
24
+ style?: GlobalStyle;
19
25
  aliasPath?: string;
20
26
  [key: string]: any;
21
27
  }
28
+ interface AppPlus {
29
+ background?: HEXColor;
30
+ bounce?: string;
31
+ popGesture?: 'close' | 'none';
32
+ softInputNavBar?: 'auto' | 'none';
33
+ softInputMode?: 'adjustResize' | 'adjustPan';
34
+ pullToRefresh?: {
35
+ support?: boolean;
36
+ color?: HEXColor;
37
+ style?: 'default' | 'circle';
38
+ height?: PxSize | PercentageSize;
39
+ range?: PxSize | PercentageSize;
40
+ offset?: PxSize | PercentageSize;
41
+ contentdown?: {
42
+ caption?: string;
43
+ [x: string]: any;
44
+ };
45
+ contentover?: {
46
+ caption?: string;
47
+ [x: string]: any;
48
+ };
49
+ contentrefresh?: {
50
+ caption?: string;
51
+ [x: string]: any;
52
+ };
53
+ [x: string]: any;
54
+ };
55
+ scrollIndicator?: string;
56
+ animationType?: AnimationType;
57
+ animationDuration?: number;
58
+ [x: string]: any;
59
+ }
60
+ interface H5 {
61
+ pullToRefresh?: {
62
+ color?: HEXColor;
63
+ offset?: PxSize | PercentageSize;
64
+ [x: string]: any;
65
+ };
66
+ [x: string]: any;
67
+ }
68
+ interface MpAlipay {
69
+ allowsBounceVertical?: 'YES' | 'NO';
70
+ backgroundColor?: HEXColor | ThemeVar;
71
+ backgroundImageColor?: HEXColor;
72
+ backgroundImageUrl?: string;
73
+ defaultTitle?: string;
74
+ enableScrollBar?: 'YES' | 'NO';
75
+ gestureBack?: 'YES' | 'NO';
76
+ onReachBottomDistance?: number;
77
+ pullRefresh?: boolean;
78
+ responsive?: boolean;
79
+ showTitleLoading?: 'YES' | 'NO';
80
+ transparentTitle?: 'always' | 'auto' | 'none';
81
+ titlePenetrate?: 'YES' | 'NO';
82
+ titleImage?: string;
83
+ titleBarColor?: HEXColor;
84
+ navigationBarFrontColor?: 'black' | 'white';
85
+ [x: string]: any;
86
+ }
87
+ interface MpBaidu {
88
+ navigationBarBackgroundColor?: HEXColor | ThemeVar;
89
+ navigationBarTextStyle?: 'black' | 'white' | ThemeVar;
90
+ navigationBarTitleText?: string;
91
+ navigationStyle?: 'default' | 'custom';
92
+ backgroundColor?: HEXColor | ThemeVar;
93
+ backgroundTextStyle?: 'dark' | 'light' | ThemeVar;
94
+ backgroundColorTop?: HEXColor | ThemeVar;
95
+ backgroundColorBottom?: HEXColor | ThemeVar;
96
+ enablePullDownRefresh?: boolean;
97
+ onReachBottomDistance?: number;
98
+ textSizeAdjust?: 'auto' | 'none';
99
+ pageOrientation?: 'auto' | 'portrait' | 'landscape';
100
+ [x: string]: any;
101
+ }
102
+ interface MpJd {
103
+ navigationBarBackgroundColor?: HEXColor | ThemeVar;
104
+ navigationBarTextStyle?: 'black' | 'white' | ThemeVar;
105
+ navigationBarTitleText?: string;
106
+ navigationStyle?: 'default' | 'custom';
107
+ backgroundColor?: HEXColor | ThemeVar;
108
+ backgroundTextStyle?: 'dark' | 'light' | ThemeVar;
109
+ backgroundColorTop?: HEXColor | ThemeVar;
110
+ backgroundColorBottom?: HEXColor | ThemeVar;
111
+ enablePullDownRefresh?: boolean;
112
+ [x: string]: any;
113
+ }
114
+ interface MpKuaishou {
115
+ navigationBarBackgroundColor?: HEXColor | ThemeVar;
116
+ navigationBarTextStyle?: 'black' | 'white' | ThemeVar;
117
+ navigationBarTitleText?: string;
118
+ navigationStyle?: 'default' | 'custom';
119
+ backgroundColor?: HEXColor | ThemeVar;
120
+ backgroundTextStyle?: 'dark' | 'light' | ThemeVar;
121
+ backgroundColorTop?: HEXColor | ThemeVar;
122
+ backgroundColorBottom?: HEXColor | ThemeVar;
123
+ enablePullDownRefresh?: boolean;
124
+ onReachBottomDistance?: number;
125
+ pageOrientation?: 'auto' | 'portrait' | 'landscape';
126
+ [x: string]: any;
127
+ }
128
+ interface MpLark {
129
+ navigationBarBackgroundColor?: HEXColor | ThemeVar;
130
+ navigationBarTextStyle?: 'black' | 'white' | ThemeVar;
131
+ navigationBarTitleText?: string;
132
+ transparentTitle?: 'always' | 'auto' | 'none';
133
+ navigationStyle?: 'default' | 'custom';
134
+ backgroundColor?: HEXColor | ThemeVar;
135
+ backgroundTextStyle?: 'dark' | 'light' | ThemeVar;
136
+ backgroundColorTop?: HEXColor | ThemeVar;
137
+ backgroundColorBottom?: HEXColor | ThemeVar;
138
+ enablePullDownRefresh?: boolean;
139
+ onReachBottomDistance?: number;
140
+ PCMode?: Omit<MpLark, 'PCMode'>;
141
+ [x: string]: any;
142
+ }
143
+ interface MpQq {
144
+ navigationBarBackgroundColor?: HEXColor | ThemeVar;
145
+ navigationBarTextStyle?: 'black' | 'white' | ThemeVar;
146
+ navigationBarTitleText?: string;
147
+ navigationStyle?: 'default' | 'custom';
148
+ backgroundColor?: HEXColor | ThemeVar;
149
+ backgroundTextStyle?: 'dark' | 'light' | ThemeVar;
150
+ backgroundColorTop?: HEXColor | ThemeVar;
151
+ backgroundColorBottom?: HEXColor | ThemeVar;
152
+ enablePullDownRefresh?: boolean;
153
+ pageOrientation?: 'auto' | 'portrait' | 'landscape';
154
+ [x: string]: any;
155
+ }
156
+ interface MpToutiao {
157
+ navigationBarBackgroundColor?: HEXColor | ThemeVar;
158
+ navigationBarTextStyle?: 'black' | 'white' | ThemeVar;
159
+ navigationBarTitleText?: string;
160
+ navigationStyle?: 'default' | 'custom';
161
+ backgroundColor?: HEXColor | ThemeVar;
162
+ backgroundTextStyle?: 'dark' | 'light' | ThemeVar;
163
+ backgroundColorTop?: HEXColor | ThemeVar;
164
+ backgroundColorBottom?: HEXColor | ThemeVar;
165
+ enablePullDownRefresh?: boolean;
166
+ onReachBottomDistance?: number;
167
+ transparentTitle?: 'always' | 'auto' | 'none';
168
+ skeleton?: {
169
+ config?: {
170
+ timeout?: number;
171
+ loading?: 'spin' | 'chiaroscuro' | 'shine';
172
+ image?: {
173
+ shape?: 'circle' | 'rect';
174
+ color?: HEXColor;
175
+ [x: string]: any;
176
+ };
177
+ button?: {
178
+ color?: HEXColor;
179
+ [x: string]: any;
180
+ };
181
+ backgroundColor?: HEXColor;
182
+ mode?: 'fullscreen' | 'auto';
183
+ cssUnit?: 'px' | 'rem' | 'vw' | 'vh' | 'vmin' | 'vmax';
184
+ decimal?: number;
185
+ [x: string]: any;
186
+ };
187
+ page?: Record<string, string>;
188
+ [x: string]: any;
189
+ };
190
+ [x: string]: any;
191
+ }
192
+ interface MpWeixin {
193
+ navigationBarBackgroundColor?: HEXColor | ThemeVar;
194
+ navigationBarTextStyle?: 'black' | 'white' | ThemeVar;
195
+ navigationBarTitleText?: string;
196
+ navigationStyle?: 'default' | 'custom';
197
+ homeButton?: boolean;
198
+ backgroundColor?: HEXColor | ThemeVar;
199
+ backgroundTextStyle?: 'dark' | 'light' | ThemeVar;
200
+ backgroundColorTop?: HEXColor | ThemeVar;
201
+ backgroundColorBottom?: HEXColor | ThemeVar;
202
+ enablePullDownRefresh?: boolean;
203
+ onReachBottomDistance?: number;
204
+ pageOrientation?: 'auto' | 'portrait' | 'landscape';
205
+ restartStrategy?: 'homePage' | 'homePageAndLatestPage';
206
+ initialRenderingCache?: 'static' | 'dynamic';
207
+ visualEffectInBackground?: 'hidden' | 'none';
208
+ handleWebviewPreload?: 'static' | 'manual' | 'auto';
209
+ [x: string]: any;
210
+ }
211
+ interface GlobalStyle {
212
+ 'navigationBarBackgroundColor'?: HEXColor | ThemeVar;
213
+ 'navigationBarTextStyle'?: 'black' | 'white' | ThemeVar;
214
+ 'navigationBarTitleText'?: string;
215
+ 'navigationBarShadow'?: {
216
+ colorType?: 'grey' | 'blue' | 'green' | 'orange' | 'red' | 'yellow';
217
+ };
218
+ 'navigationStyle'?: 'default' | 'custom';
219
+ 'backgroundColor'?: HEXColor | ThemeVar;
220
+ 'backgroundTextStyle'?: 'dark' | 'light' | ThemeVar;
221
+ 'enablePullDownRefresh'?: boolean;
222
+ 'onReachBottomDistance'?: number;
223
+ 'backgroundColorTop'?: HEXColor | ThemeVar;
224
+ 'backgroundColorBottom'?: HEXColor | ThemeVar;
225
+ 'titleImage'?: string;
226
+ 'transparentTitle'?: 'always' | 'auto' | 'none';
227
+ 'titlePenetrate'?: 'YES' | 'NO';
228
+ 'pageOrientation'?: string;
229
+ 'animationType'?: AnimationType;
230
+ 'animationDuration'?: number;
231
+ 'app-plus'?: AppPlus;
232
+ 'h5'?: H5;
233
+ 'mp-alipay'?: MpAlipay;
234
+ 'mp-weixin'?: MpWeixin;
235
+ 'mp-baidu'?: MpBaidu;
236
+ 'mp-toutiao'?: MpToutiao;
237
+ 'mp-lark'?: MpLark;
238
+ 'mp-qq'?: MpQq;
239
+ 'mp-kuaishou'?: MpKuaishou;
240
+ 'mp-jd'?: MpJd;
241
+ 'usingComponents'?: Record<string, string>;
242
+ 'renderingMode'?: string;
243
+ 'leftWindow'?: boolean;
244
+ 'topWindow'?: boolean;
245
+ 'rightWindow'?: boolean;
246
+ 'rpxCalcMaxDeviceWidth'?: number;
247
+ 'rpxCalcBaseDeviceWidth'?: number;
248
+ 'rpxCalcIncludeWidth'?: number;
249
+ 'dynamicRpx'?: boolean;
250
+ 'maxWidth'?: number;
251
+ [x: string]: any;
252
+ }
22
253
  interface RouteLocationNormalized {
23
254
  path: string;
24
- name?: string | symbol;
255
+ name?: string;
25
256
  params: RouteParams;
26
257
  query: LocationQuery;
27
258
  hash: string;
28
259
  fullPath: string;
29
260
  meta: RouteMeta;
261
+ style?: GlobalStyle;
30
262
  redirectedFrom?: RouteLocationNormalized;
263
+ [x: string]: any;
31
264
  }
32
265
  type RouteLocationRaw = string | {
33
266
  path?: string;
@@ -69,4 +302,4 @@ declare function createRouter(options: RouterOptions): Router;
69
302
  declare function useRouter(): Router;
70
303
  declare function useRoute(): RouteLocationNormalized;
71
304
  //#endregion
72
- export { AnimationType, LocationQuery, NavType, NavigationGuard, NavigationGuardNext, NavigationHookAfter, RouteBackLocation, RouteBackRaw, RouteLocationBase, RouteLocationNormalized, RouteLocationRaw, RouteMeta, RouteParams, RouteRecordRaw, Router, RouterOptions, START_LOCATION_NORMALIZED, createRouter, useRoute, useRouter };
305
+ export { AnimationType, GlobalStyle, HEXColor, LocationQuery, NavType, NavigationGuard, NavigationGuardNext, NavigationHookAfter, PercentageSize, PxSize, RGBAColor, RouteBackLocation, RouteBackRaw, RouteLocationBase, RouteLocationNormalized, RouteLocationRaw, RouteMeta, RouteParams, RouteRecordRaw, Router, RouterOptions, START_LOCATION_NORMALIZED, ThemeVar, createRouter, useRoute, useRouter };
package/dist/index.d.mts CHANGED
@@ -5,6 +5,11 @@ type RouteParams = Record<string, string | string[]>;
5
5
  type LocationQuery = Record<string, string | null | (string | null)[]>;
6
6
  type RouteMeta = Record<string | number | symbol, unknown>;
7
7
  type AnimationType = 'auto' | 'none' | 'slide-out-right' | 'slide-out-left' | 'slide-out-top' | 'slide-out-bottom' | 'fade-out' | 'zoom-in' | 'zoom-fade-in' | 'pop-out';
8
+ type RGBAColor = `rgba(${number}, ${number}, ${number}, ${number})`;
9
+ type HEXColor = `#${string}`;
10
+ type PxSize = `${number}px`;
11
+ type PercentageSize = `${number}%`;
12
+ type ThemeVar = `@${string}`;
8
13
  interface RouteLocationBase {
9
14
  animationType?: AnimationType;
10
15
  animationDuration?: number;
@@ -16,18 +21,246 @@ interface RouteRecordRaw {
16
21
  path: string;
17
22
  name?: string;
18
23
  meta?: RouteMeta;
24
+ style?: GlobalStyle;
19
25
  aliasPath?: string;
20
26
  [key: string]: any;
21
27
  }
28
+ interface AppPlus {
29
+ background?: HEXColor;
30
+ bounce?: string;
31
+ popGesture?: 'close' | 'none';
32
+ softInputNavBar?: 'auto' | 'none';
33
+ softInputMode?: 'adjustResize' | 'adjustPan';
34
+ pullToRefresh?: {
35
+ support?: boolean;
36
+ color?: HEXColor;
37
+ style?: 'default' | 'circle';
38
+ height?: PxSize | PercentageSize;
39
+ range?: PxSize | PercentageSize;
40
+ offset?: PxSize | PercentageSize;
41
+ contentdown?: {
42
+ caption?: string;
43
+ [x: string]: any;
44
+ };
45
+ contentover?: {
46
+ caption?: string;
47
+ [x: string]: any;
48
+ };
49
+ contentrefresh?: {
50
+ caption?: string;
51
+ [x: string]: any;
52
+ };
53
+ [x: string]: any;
54
+ };
55
+ scrollIndicator?: string;
56
+ animationType?: AnimationType;
57
+ animationDuration?: number;
58
+ [x: string]: any;
59
+ }
60
+ interface H5 {
61
+ pullToRefresh?: {
62
+ color?: HEXColor;
63
+ offset?: PxSize | PercentageSize;
64
+ [x: string]: any;
65
+ };
66
+ [x: string]: any;
67
+ }
68
+ interface MpAlipay {
69
+ allowsBounceVertical?: 'YES' | 'NO';
70
+ backgroundColor?: HEXColor | ThemeVar;
71
+ backgroundImageColor?: HEXColor;
72
+ backgroundImageUrl?: string;
73
+ defaultTitle?: string;
74
+ enableScrollBar?: 'YES' | 'NO';
75
+ gestureBack?: 'YES' | 'NO';
76
+ onReachBottomDistance?: number;
77
+ pullRefresh?: boolean;
78
+ responsive?: boolean;
79
+ showTitleLoading?: 'YES' | 'NO';
80
+ transparentTitle?: 'always' | 'auto' | 'none';
81
+ titlePenetrate?: 'YES' | 'NO';
82
+ titleImage?: string;
83
+ titleBarColor?: HEXColor;
84
+ navigationBarFrontColor?: 'black' | 'white';
85
+ [x: string]: any;
86
+ }
87
+ interface MpBaidu {
88
+ navigationBarBackgroundColor?: HEXColor | ThemeVar;
89
+ navigationBarTextStyle?: 'black' | 'white' | ThemeVar;
90
+ navigationBarTitleText?: string;
91
+ navigationStyle?: 'default' | 'custom';
92
+ backgroundColor?: HEXColor | ThemeVar;
93
+ backgroundTextStyle?: 'dark' | 'light' | ThemeVar;
94
+ backgroundColorTop?: HEXColor | ThemeVar;
95
+ backgroundColorBottom?: HEXColor | ThemeVar;
96
+ enablePullDownRefresh?: boolean;
97
+ onReachBottomDistance?: number;
98
+ textSizeAdjust?: 'auto' | 'none';
99
+ pageOrientation?: 'auto' | 'portrait' | 'landscape';
100
+ [x: string]: any;
101
+ }
102
+ interface MpJd {
103
+ navigationBarBackgroundColor?: HEXColor | ThemeVar;
104
+ navigationBarTextStyle?: 'black' | 'white' | ThemeVar;
105
+ navigationBarTitleText?: string;
106
+ navigationStyle?: 'default' | 'custom';
107
+ backgroundColor?: HEXColor | ThemeVar;
108
+ backgroundTextStyle?: 'dark' | 'light' | ThemeVar;
109
+ backgroundColorTop?: HEXColor | ThemeVar;
110
+ backgroundColorBottom?: HEXColor | ThemeVar;
111
+ enablePullDownRefresh?: boolean;
112
+ [x: string]: any;
113
+ }
114
+ interface MpKuaishou {
115
+ navigationBarBackgroundColor?: HEXColor | ThemeVar;
116
+ navigationBarTextStyle?: 'black' | 'white' | ThemeVar;
117
+ navigationBarTitleText?: string;
118
+ navigationStyle?: 'default' | 'custom';
119
+ backgroundColor?: HEXColor | ThemeVar;
120
+ backgroundTextStyle?: 'dark' | 'light' | ThemeVar;
121
+ backgroundColorTop?: HEXColor | ThemeVar;
122
+ backgroundColorBottom?: HEXColor | ThemeVar;
123
+ enablePullDownRefresh?: boolean;
124
+ onReachBottomDistance?: number;
125
+ pageOrientation?: 'auto' | 'portrait' | 'landscape';
126
+ [x: string]: any;
127
+ }
128
+ interface MpLark {
129
+ navigationBarBackgroundColor?: HEXColor | ThemeVar;
130
+ navigationBarTextStyle?: 'black' | 'white' | ThemeVar;
131
+ navigationBarTitleText?: string;
132
+ transparentTitle?: 'always' | 'auto' | 'none';
133
+ navigationStyle?: 'default' | 'custom';
134
+ backgroundColor?: HEXColor | ThemeVar;
135
+ backgroundTextStyle?: 'dark' | 'light' | ThemeVar;
136
+ backgroundColorTop?: HEXColor | ThemeVar;
137
+ backgroundColorBottom?: HEXColor | ThemeVar;
138
+ enablePullDownRefresh?: boolean;
139
+ onReachBottomDistance?: number;
140
+ PCMode?: Omit<MpLark, 'PCMode'>;
141
+ [x: string]: any;
142
+ }
143
+ interface MpQq {
144
+ navigationBarBackgroundColor?: HEXColor | ThemeVar;
145
+ navigationBarTextStyle?: 'black' | 'white' | ThemeVar;
146
+ navigationBarTitleText?: string;
147
+ navigationStyle?: 'default' | 'custom';
148
+ backgroundColor?: HEXColor | ThemeVar;
149
+ backgroundTextStyle?: 'dark' | 'light' | ThemeVar;
150
+ backgroundColorTop?: HEXColor | ThemeVar;
151
+ backgroundColorBottom?: HEXColor | ThemeVar;
152
+ enablePullDownRefresh?: boolean;
153
+ pageOrientation?: 'auto' | 'portrait' | 'landscape';
154
+ [x: string]: any;
155
+ }
156
+ interface MpToutiao {
157
+ navigationBarBackgroundColor?: HEXColor | ThemeVar;
158
+ navigationBarTextStyle?: 'black' | 'white' | ThemeVar;
159
+ navigationBarTitleText?: string;
160
+ navigationStyle?: 'default' | 'custom';
161
+ backgroundColor?: HEXColor | ThemeVar;
162
+ backgroundTextStyle?: 'dark' | 'light' | ThemeVar;
163
+ backgroundColorTop?: HEXColor | ThemeVar;
164
+ backgroundColorBottom?: HEXColor | ThemeVar;
165
+ enablePullDownRefresh?: boolean;
166
+ onReachBottomDistance?: number;
167
+ transparentTitle?: 'always' | 'auto' | 'none';
168
+ skeleton?: {
169
+ config?: {
170
+ timeout?: number;
171
+ loading?: 'spin' | 'chiaroscuro' | 'shine';
172
+ image?: {
173
+ shape?: 'circle' | 'rect';
174
+ color?: HEXColor;
175
+ [x: string]: any;
176
+ };
177
+ button?: {
178
+ color?: HEXColor;
179
+ [x: string]: any;
180
+ };
181
+ backgroundColor?: HEXColor;
182
+ mode?: 'fullscreen' | 'auto';
183
+ cssUnit?: 'px' | 'rem' | 'vw' | 'vh' | 'vmin' | 'vmax';
184
+ decimal?: number;
185
+ [x: string]: any;
186
+ };
187
+ page?: Record<string, string>;
188
+ [x: string]: any;
189
+ };
190
+ [x: string]: any;
191
+ }
192
+ interface MpWeixin {
193
+ navigationBarBackgroundColor?: HEXColor | ThemeVar;
194
+ navigationBarTextStyle?: 'black' | 'white' | ThemeVar;
195
+ navigationBarTitleText?: string;
196
+ navigationStyle?: 'default' | 'custom';
197
+ homeButton?: boolean;
198
+ backgroundColor?: HEXColor | ThemeVar;
199
+ backgroundTextStyle?: 'dark' | 'light' | ThemeVar;
200
+ backgroundColorTop?: HEXColor | ThemeVar;
201
+ backgroundColorBottom?: HEXColor | ThemeVar;
202
+ enablePullDownRefresh?: boolean;
203
+ onReachBottomDistance?: number;
204
+ pageOrientation?: 'auto' | 'portrait' | 'landscape';
205
+ restartStrategy?: 'homePage' | 'homePageAndLatestPage';
206
+ initialRenderingCache?: 'static' | 'dynamic';
207
+ visualEffectInBackground?: 'hidden' | 'none';
208
+ handleWebviewPreload?: 'static' | 'manual' | 'auto';
209
+ [x: string]: any;
210
+ }
211
+ interface GlobalStyle {
212
+ 'navigationBarBackgroundColor'?: HEXColor | ThemeVar;
213
+ 'navigationBarTextStyle'?: 'black' | 'white' | ThemeVar;
214
+ 'navigationBarTitleText'?: string;
215
+ 'navigationBarShadow'?: {
216
+ colorType?: 'grey' | 'blue' | 'green' | 'orange' | 'red' | 'yellow';
217
+ };
218
+ 'navigationStyle'?: 'default' | 'custom';
219
+ 'backgroundColor'?: HEXColor | ThemeVar;
220
+ 'backgroundTextStyle'?: 'dark' | 'light' | ThemeVar;
221
+ 'enablePullDownRefresh'?: boolean;
222
+ 'onReachBottomDistance'?: number;
223
+ 'backgroundColorTop'?: HEXColor | ThemeVar;
224
+ 'backgroundColorBottom'?: HEXColor | ThemeVar;
225
+ 'titleImage'?: string;
226
+ 'transparentTitle'?: 'always' | 'auto' | 'none';
227
+ 'titlePenetrate'?: 'YES' | 'NO';
228
+ 'pageOrientation'?: string;
229
+ 'animationType'?: AnimationType;
230
+ 'animationDuration'?: number;
231
+ 'app-plus'?: AppPlus;
232
+ 'h5'?: H5;
233
+ 'mp-alipay'?: MpAlipay;
234
+ 'mp-weixin'?: MpWeixin;
235
+ 'mp-baidu'?: MpBaidu;
236
+ 'mp-toutiao'?: MpToutiao;
237
+ 'mp-lark'?: MpLark;
238
+ 'mp-qq'?: MpQq;
239
+ 'mp-kuaishou'?: MpKuaishou;
240
+ 'mp-jd'?: MpJd;
241
+ 'usingComponents'?: Record<string, string>;
242
+ 'renderingMode'?: string;
243
+ 'leftWindow'?: boolean;
244
+ 'topWindow'?: boolean;
245
+ 'rightWindow'?: boolean;
246
+ 'rpxCalcMaxDeviceWidth'?: number;
247
+ 'rpxCalcBaseDeviceWidth'?: number;
248
+ 'rpxCalcIncludeWidth'?: number;
249
+ 'dynamicRpx'?: boolean;
250
+ 'maxWidth'?: number;
251
+ [x: string]: any;
252
+ }
22
253
  interface RouteLocationNormalized {
23
254
  path: string;
24
- name?: string | symbol;
255
+ name?: string;
25
256
  params: RouteParams;
26
257
  query: LocationQuery;
27
258
  hash: string;
28
259
  fullPath: string;
29
260
  meta: RouteMeta;
261
+ style?: GlobalStyle;
30
262
  redirectedFrom?: RouteLocationNormalized;
263
+ [x: string]: any;
31
264
  }
32
265
  type RouteLocationRaw = string | {
33
266
  path?: string;
@@ -69,4 +302,4 @@ declare function createRouter(options: RouterOptions): Router;
69
302
  declare function useRouter(): Router;
70
303
  declare function useRoute(): RouteLocationNormalized;
71
304
  //#endregion
72
- export { AnimationType, LocationQuery, NavType, NavigationGuard, NavigationGuardNext, NavigationHookAfter, RouteBackLocation, RouteBackRaw, RouteLocationBase, RouteLocationNormalized, RouteLocationRaw, RouteMeta, RouteParams, RouteRecordRaw, Router, RouterOptions, START_LOCATION_NORMALIZED, createRouter, useRoute, useRouter };
305
+ export { AnimationType, GlobalStyle, HEXColor, LocationQuery, NavType, NavigationGuard, NavigationGuardNext, NavigationHookAfter, PercentageSize, PxSize, RGBAColor, RouteBackLocation, RouteBackRaw, RouteLocationBase, RouteLocationNormalized, RouteLocationRaw, RouteMeta, RouteParams, RouteRecordRaw, Router, RouterOptions, START_LOCATION_NORMALIZED, ThemeVar, createRouter, useRoute, useRouter };
package/dist/index.mjs CHANGED
@@ -1,4 +1,4 @@
1
- import { inject, shallowRef, unref } from "vue";
1
+ import { inject, reactive, shallowRef, unref, watch } from "vue";
2
2
 
3
3
  //#region src/types.ts
4
4
  const START_LOCATION_NORMALIZED = {
@@ -8,7 +8,8 @@ const START_LOCATION_NORMALIZED = {
8
8
  query: {},
9
9
  hash: "",
10
10
  fullPath: "/",
11
- meta: {}
11
+ meta: {},
12
+ style: {}
12
13
  };
13
14
 
14
15
  //#endregion
@@ -57,8 +58,8 @@ function normalizeUrl(url) {
57
58
 
58
59
  //#endregion
59
60
  //#region src/router.ts
60
- const routerKey = Symbol("router");
61
- const routeKey = Symbol("route");
61
+ const routerKey = Symbol("__ROUTER__");
62
+ const routeKey = Symbol("__ROUTE__");
62
63
  function createRouter(options) {
63
64
  const currentRoute = shallowRef(START_LOCATION_NORMALIZED);
64
65
  const routes = options.routes || [];
@@ -78,7 +79,15 @@ function createRouter(options) {
78
79
  query: finalQuery,
79
80
  hash: to.hash || "",
80
81
  fullPath: stringifyQuery(path, finalQuery),
81
- meta: route.meta || {}
82
+ meta: route.meta || {},
83
+ style: route.style || {},
84
+ ...Object.fromEntries(Object.entries(route).filter(([key]) => ![
85
+ "path",
86
+ "name",
87
+ "meta",
88
+ "style",
89
+ "aliasPath"
90
+ ].includes(key)))
82
91
  };
83
92
  }
84
93
  if (to.path) return resolvePath(to.path, to.query);
@@ -99,7 +108,15 @@ function createRouter(options) {
99
108
  query: finalQuery,
100
109
  hash: "",
101
110
  fullPath: stringifyQuery(normalizedPath, finalQuery),
102
- meta: route?.meta || {}
111
+ meta: route?.meta || {},
112
+ style: route?.style || {},
113
+ ...Object.fromEntries(Object.entries(route || {}).filter(([key]) => ![
114
+ "path",
115
+ "name",
116
+ "meta",
117
+ "style",
118
+ "aliasPath"
119
+ ].includes(key)))
103
120
  };
104
121
  }
105
122
  function fillParams(path, params) {
@@ -278,7 +295,15 @@ function createRouter(options) {
278
295
  params: {},
279
296
  query: q,
280
297
  hash: "",
281
- fullPath: fullPath.startsWith("/") ? fullPath : `/${fullPath}`
298
+ fullPath: fullPath.startsWith("/") ? fullPath : `/${fullPath}`,
299
+ style: matched?.style || {},
300
+ ...Object.fromEntries(Object.entries(matched || {}).filter(([key]) => ![
301
+ "path",
302
+ "name",
303
+ "meta",
304
+ "style",
305
+ "aliasPath"
306
+ ].includes(key)))
282
307
  };
283
308
  router$1.currentRoute.value = to;
284
309
  afterGuards$1?.forEach((guard) => guard(to, from));
@@ -302,10 +327,19 @@ function createRouter(options) {
302
327
  //#endregion
303
328
  //#region src/index.ts
304
329
  function useRouter() {
305
- return inject(routerKey);
330
+ const router = inject(routerKey);
331
+ if (router) return router;
332
+ else throw new Error("useRouter 只可以在 Vue 上下文中使用，请确保你已经正确地注册了 \"uni-mini-router\" 并且当前正处于 Vue 上下文中");
306
333
  }
307
334
  function useRoute() {
308
- return inject(routeKey);
335
+ const currentRoute = inject(routeKey);
336
+ if (currentRoute) {
337
+ const route = reactive(currentRoute.value);
338
+ watch(currentRoute, (to) => {
339
+ Object.assign(route, to);
340
+ });
341
+ return route;
342
+ } else throw new Error("useRoute 只可以在 Vue 上下文中使用，请确保你已经正确地注册了 \"uni-mini-router\" 并且当前正处于 Vue 上下文中");
309
343
  }
310
344
 
311
345
  //#endregion
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wot-ui/router",
3
- "version": "1.0.0",
3
+ "version": "1.1.1",
4
4
  "description": "轻量级 uni-app vue3 路由库",
5
5
  "repository": {
6
6
  "type": "git",