@hlw-uni/mp-vue 2.1.97 → 2.1.99
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.
- package/dist/index.js +2 -27
- package/dist/index.mjs +2 -27
- package/package.json +1 -1
- package/src/components/hlw-nav-bar/index.vue +2 -2
- package/src/components/hlw-page/index.vue +20 -14
- package/src/core/theme/index.ts +1 -37
package/dist/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
(function(global, factory) {
|
|
2
|
-
typeof exports === "object" && typeof module !== "undefined" ? factory(exports, require("vue"), require("
|
|
3
|
-
})(this, function(exports2, vue,
|
|
2
|
+
typeof exports === "object" && typeof module !== "undefined" ? factory(exports, require("vue"), require("pinia"), require("@dcloudio/uni-app")) : typeof define === "function" && define.amd ? define(["exports", "vue", "pinia", "@dcloudio/uni-app"], factory) : (global = typeof globalThis !== "undefined" ? globalThis : global || self, factory(global.HlwUniVue = {}, global.vue, global.pinia, global.uniApp));
|
|
3
|
+
})(this, function(exports2, vue, pinia, uniApp) {
|
|
4
4
|
"use strict";var __defProp = Object.defineProperty;
|
|
5
5
|
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
6
6
|
var __publicField = (obj, key, value) => {
|
|
@@ -98,31 +98,6 @@ var __publicField = (obj, key, value) => {
|
|
|
98
98
|
function useTheme() {
|
|
99
99
|
const store = useThemeStore();
|
|
100
100
|
const theme = vue.computed(() => store.theme);
|
|
101
|
-
const updateNavbarColor = (targetTheme) => {
|
|
102
|
-
const isDarkTheme = ["mono-theme", "color-theme"].includes(targetTheme);
|
|
103
|
-
uni.setNavigationBarColor({
|
|
104
|
-
frontColor: isDarkTheme ? "#ffffff" : "#000000",
|
|
105
|
-
backgroundColor: isDarkTheme ? "#3b82f6" : "#ffffff",
|
|
106
|
-
fail: () => {
|
|
107
|
-
}
|
|
108
|
-
});
|
|
109
|
-
};
|
|
110
|
-
vue.watch(
|
|
111
|
-
theme,
|
|
112
|
-
(newTheme) => {
|
|
113
|
-
updateNavbarColor(newTheme);
|
|
114
|
-
}
|
|
115
|
-
);
|
|
116
|
-
vue.onMounted(() => {
|
|
117
|
-
updateNavbarColor(store.theme);
|
|
118
|
-
});
|
|
119
|
-
try {
|
|
120
|
-
uniApp.onShow(() => {
|
|
121
|
-
updateNavbarColor(store.theme);
|
|
122
|
-
});
|
|
123
|
-
} catch (e) {
|
|
124
|
-
}
|
|
125
|
-
updateNavbarColor(store.theme);
|
|
126
101
|
const fontSize = vue.computed(() => store.fontSize);
|
|
127
102
|
const fontSizeClass = vue.computed(() => {
|
|
128
103
|
const found = fontSizePresets.find((p) => p.id === store.fontSize);
|
package/dist/index.mjs
CHANGED
|
@@ -4,9 +4,9 @@ var __publicField = (obj, key, value) => {
|
|
|
4
4
|
__defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
|
5
5
|
return value;
|
|
6
6
|
};
|
|
7
|
-
import { computed,
|
|
8
|
-
import { onShow, onShareAppMessage, onShareTimeline } from "@dcloudio/uni-app";
|
|
7
|
+
import { computed, ref, onBeforeUpdate, onUnmounted, createSSRApp } from "vue";
|
|
9
8
|
import { defineStore } from "pinia";
|
|
9
|
+
import { onShareAppMessage, onShareTimeline } from "@dcloudio/uni-app";
|
|
10
10
|
const themePresets = [
|
|
11
11
|
{
|
|
12
12
|
id: "white-theme",
|
|
@@ -97,31 +97,6 @@ const useThemeStore = defineStore("theme", {
|
|
|
97
97
|
function useTheme() {
|
|
98
98
|
const store = useThemeStore();
|
|
99
99
|
const theme = computed(() => store.theme);
|
|
100
|
-
const updateNavbarColor = (targetTheme) => {
|
|
101
|
-
const isDarkTheme = ["mono-theme", "color-theme"].includes(targetTheme);
|
|
102
|
-
uni.setNavigationBarColor({
|
|
103
|
-
frontColor: isDarkTheme ? "#ffffff" : "#000000",
|
|
104
|
-
backgroundColor: isDarkTheme ? "#3b82f6" : "#ffffff",
|
|
105
|
-
fail: () => {
|
|
106
|
-
}
|
|
107
|
-
});
|
|
108
|
-
};
|
|
109
|
-
watch(
|
|
110
|
-
theme,
|
|
111
|
-
(newTheme) => {
|
|
112
|
-
updateNavbarColor(newTheme);
|
|
113
|
-
}
|
|
114
|
-
);
|
|
115
|
-
onMounted(() => {
|
|
116
|
-
updateNavbarColor(store.theme);
|
|
117
|
-
});
|
|
118
|
-
try {
|
|
119
|
-
onShow(() => {
|
|
120
|
-
updateNavbarColor(store.theme);
|
|
121
|
-
});
|
|
122
|
-
} catch (e) {
|
|
123
|
-
}
|
|
124
|
-
updateNavbarColor(store.theme);
|
|
125
100
|
const fontSize = computed(() => store.fontSize);
|
|
126
101
|
const fontSizeClass = computed(() => {
|
|
127
102
|
const found = fontSizePresets.find((p) => p.id === store.fontSize);
|
package/package.json
CHANGED
|
@@ -23,7 +23,7 @@
|
|
|
23
23
|
* @props
|
|
24
24
|
* title - 导航栏标题文字
|
|
25
25
|
* isBack - 是否显示返回按钮,默认 false;点击自动回退或回到首页
|
|
26
|
-
* isBar - 是否占用状态栏高度,默认
|
|
26
|
+
* isBar - 是否占用状态栏高度,默认 true
|
|
27
27
|
*
|
|
28
28
|
* @example
|
|
29
29
|
* ```vue
|
|
@@ -41,7 +41,7 @@ const menuButtonInfo = uni.getMenuButtonBoundingClientRect();
|
|
|
41
41
|
const props = defineProps({
|
|
42
42
|
isBar: {
|
|
43
43
|
type: Boolean,
|
|
44
|
-
default:
|
|
44
|
+
default: true,
|
|
45
45
|
},
|
|
46
46
|
title: {
|
|
47
47
|
type: String,
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
<view :class="[theme, fontSizeClass, fontFamilyClass]">
|
|
3
|
-
<hlw-nav-bar v-if="props.
|
|
3
|
+
<hlw-nav-bar v-if="props.isNav" :is-back="props.isBack" :title="title" :is-bar="props.isBar"></hlw-nav-bar>
|
|
4
4
|
<slot></slot>
|
|
5
|
+
<view class="h-[50rpx]"></view>
|
|
5
6
|
</view>
|
|
6
7
|
</template>
|
|
7
8
|
|
|
@@ -13,13 +14,14 @@
|
|
|
13
14
|
* 可以快捷集成自定义导航栏(HlwNavBar),保持整个页面结构的一致性。
|
|
14
15
|
*
|
|
15
16
|
* @props
|
|
16
|
-
*
|
|
17
|
-
*
|
|
18
|
-
*
|
|
17
|
+
* isNav - 是否显示自定义导航栏,默认 false
|
|
18
|
+
* isBar - 是否占用状态栏高度,默认 true
|
|
19
|
+
* title - 自定义导航栏标题文字
|
|
20
|
+
* isBack - 是否显示自定义导航栏的返回键,默认 false
|
|
19
21
|
*
|
|
20
22
|
* @example
|
|
21
23
|
* ```vue
|
|
22
|
-
* <hlw-page is-
|
|
24
|
+
* <hlw-page is-nav is-back title="个人中心">
|
|
23
25
|
* <view>页面内容...</view>
|
|
24
26
|
* </hlw-page>
|
|
25
27
|
* ```
|
|
@@ -30,10 +32,14 @@ import { ref } from "vue";
|
|
|
30
32
|
const { theme, fontSizeClass, fontFamilyClass } = useTheme();
|
|
31
33
|
|
|
32
34
|
const props = defineProps({
|
|
33
|
-
|
|
35
|
+
isNav: {
|
|
34
36
|
type: Boolean,
|
|
35
37
|
default: false,
|
|
36
38
|
},
|
|
39
|
+
isBar: {
|
|
40
|
+
type: Boolean,
|
|
41
|
+
default: true,
|
|
42
|
+
},
|
|
37
43
|
title: {
|
|
38
44
|
type: String,
|
|
39
45
|
default: "",
|
|
@@ -95,46 +101,46 @@ const title = ref(props.title);
|
|
|
95
101
|
Roboto,
|
|
96
102
|
Helvetica,
|
|
97
103
|
Arial,
|
|
98
|
-
sans-serif
|
|
104
|
+
sans-serif;
|
|
99
105
|
view,
|
|
100
106
|
text,
|
|
101
107
|
button,
|
|
102
108
|
input,
|
|
103
109
|
textarea {
|
|
104
|
-
font-family: inherit
|
|
110
|
+
font-family: inherit;
|
|
105
111
|
}
|
|
106
112
|
}
|
|
107
113
|
|
|
108
114
|
.font-family-sans {
|
|
109
|
-
font-family: "PingFang SC", "Helvetica Neue", "Microsoft YaHei", sans-serif
|
|
115
|
+
font-family: "PingFang SC", "Helvetica Neue", "Microsoft YaHei", sans-serif;
|
|
110
116
|
view,
|
|
111
117
|
text,
|
|
112
118
|
button,
|
|
113
119
|
input,
|
|
114
120
|
textarea {
|
|
115
|
-
font-family: inherit
|
|
121
|
+
font-family: inherit;
|
|
116
122
|
}
|
|
117
123
|
}
|
|
118
124
|
|
|
119
125
|
.font-family-serif {
|
|
120
|
-
font-family: "Songti SC", "STSong", "SimSun", "Georgia", serif
|
|
126
|
+
font-family: "Songti SC", "STSong", "SimSun", "Georgia", serif;
|
|
121
127
|
view,
|
|
122
128
|
text,
|
|
123
129
|
button,
|
|
124
130
|
input,
|
|
125
131
|
textarea {
|
|
126
|
-
font-family: inherit
|
|
132
|
+
font-family: inherit;
|
|
127
133
|
}
|
|
128
134
|
}
|
|
129
135
|
|
|
130
136
|
.font-family-kaiti {
|
|
131
|
-
font-family: "Kaiti SC", "STKaiti", "KaiTi", "SimKai", serif
|
|
137
|
+
font-family: "Kaiti SC", "STKaiti", "KaiTi", "SimKai", serif;
|
|
132
138
|
view,
|
|
133
139
|
text,
|
|
134
140
|
button,
|
|
135
141
|
input,
|
|
136
142
|
textarea {
|
|
137
|
-
font-family: inherit
|
|
143
|
+
font-family: inherit;
|
|
138
144
|
}
|
|
139
145
|
}
|
|
140
146
|
</style>
|
package/src/core/theme/index.ts
CHANGED
|
@@ -1,6 +1,5 @@
|
|
|
1
|
-
import { computed
|
|
1
|
+
import { computed } from "vue";
|
|
2
2
|
import type { ComputedRef } from "vue";
|
|
3
|
-
import { onShow } from "@dcloudio/uni-app";
|
|
4
3
|
import {
|
|
5
4
|
useThemeStore,
|
|
6
5
|
themePresets,
|
|
@@ -28,41 +27,6 @@ export function useTheme() {
|
|
|
28
27
|
|
|
29
28
|
// 主题
|
|
30
29
|
const theme: ComputedRef<string> = computed(() => store.theme);
|
|
31
|
-
|
|
32
|
-
// 辅助方法:设置系统状态栏/导航栏前景色(mono-theme 和 color-theme 设为白色,其余为黑色)
|
|
33
|
-
const updateNavbarColor = (targetTheme: string) => {
|
|
34
|
-
const isDarkTheme = ["mono-theme", "color-theme"].includes(targetTheme);
|
|
35
|
-
uni.setNavigationBarColor({
|
|
36
|
-
frontColor: isDarkTheme ? "#ffffff" : "#000000",
|
|
37
|
-
backgroundColor: isDarkTheme ? "#3b82f6" : "#ffffff",
|
|
38
|
-
fail: () => {}
|
|
39
|
-
});
|
|
40
|
-
};
|
|
41
|
-
|
|
42
|
-
// 1. 监控主题属性改变时,动态刷新
|
|
43
|
-
watch(
|
|
44
|
-
theme,
|
|
45
|
-
(newTheme) => {
|
|
46
|
-
updateNavbarColor(newTheme);
|
|
47
|
-
}
|
|
48
|
-
);
|
|
49
|
-
|
|
50
|
-
// 2. 组件/页面挂载完成时,执行一次设定
|
|
51
|
-
onMounted(() => {
|
|
52
|
-
updateNavbarColor(store.theme);
|
|
53
|
-
});
|
|
54
|
-
|
|
55
|
-
// 3. 页面显示或回退时,强行重刷前景色(try-catch 规避非 Page 的报错)
|
|
56
|
-
try {
|
|
57
|
-
onShow(() => {
|
|
58
|
-
updateNavbarColor(store.theme);
|
|
59
|
-
});
|
|
60
|
-
} catch (e) {
|
|
61
|
-
// 忽略非 Page 组件的绑定失败
|
|
62
|
-
}
|
|
63
|
-
|
|
64
|
-
// 4. 在 setup 初始化同步阶段以最快速度设定一次,尽可能规避生命周期滞后导致的闪烁
|
|
65
|
-
updateNavbarColor(store.theme);
|
|
66
30
|
|
|
67
31
|
// 字体大小
|
|
68
32
|
const fontSize: ComputedRef<string> = computed(() => store.fontSize);
|