bimwe/mini-programs
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修改消息也图标

Browse Source
This commit is contained in:
张成
2025-11-16 20:06:22 +08:00
parent ad971796ba
commit eb10ba0a38
7 changed files with 115 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/app.ts
View File

@@ -27,8 +27,10 @@ class App extends Component<AppProps> {
}
componentDidMount() {
// 初始化字典数据
this.getNavBarHeight();
// 使用 requestAnimationFrame 延迟执行，避免阻塞首屏渲染
requestAnimationFrame(() => {
this.getNavBarHeight();
});
// this.getLocation()
}

20
src/game_pages/list/index.tsx
View File

@@ -215,10 +215,26 @@ const ListPage = () => {
);
useEffect(() => {
getLocation();
fetchUserInfo();
// 分批异步执行初始化操作，避免阻塞首屏渲染
// 1. 立即执行：获取城市和二维码（轻量操作）
getCities();
getCityQrCode();
// 2. 延迟执行：获取用户信息（不阻塞渲染）
requestAnimationFrame(() => {
fetchUserInfo().catch((error) => {
console.error('获取用户信息失败:', error);
});
});
// 3. 延迟执行：获取位置信息（可能较慢，不阻塞首屏）
requestAnimationFrame(() => {
requestAnimationFrame(() => {
getLocation().catch((error) => {
console.error('获取位置信息失败:', error);
});
});
});
}, []);
// 监听数据变化，如果是第一页就恢复显示搜索框

19
src/home_pages/index.tsx
View File

@@ -9,26 +9,23 @@ const HomePage: React.FC = () => {
useEffect(() => {
const handleLoginRedirect = async () => {
const handleLoginRedirect = () => {
const login_status = check_login_status();
if (login_status) {
try {
// 先获取用户信息
await fetchUserInfo();
// 用户信息获取成功后跳转到主容器页面
Taro.redirectTo({ url: '/main_pages/index' });
} catch (error) {
// 先跳转，不阻塞启动
Taro.redirectTo({ url: '/main_pages/index' });
// 异步获取用户信息，不阻塞跳转
fetchUserInfo().catch((error) => {
console.error('获取用户信息失败:', error);
// 如果获取用户信息失败，跳转到登录页
Taro.redirectTo({ url: '/login_pages/index/index' });
}
});
} else {
Taro.redirectTo({ url: '/login_pages/index/index' });
}
};
handleLoginRedirect();
}, [fetchUserInfo]);
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []); // fetchUserInfo 是稳定的函数引用，不需要加入依赖项
return (
<View className="home_page">

20
src/main_pages/components/ListPageContent.tsx
View File

@@ -191,10 +191,26 @@ const ListPageContent: React.FC<ListPageContentProps> = ({
);
useEffect(() => {
getLocation();
fetchUserInfo();
// 分批异步执行初始化操作，避免阻塞首屏渲染
// 1. 立即执行：获取城市和二维码（轻量操作）
getCities();
getCityQrCode();
// 2. 延迟执行：获取用户信息（不阻塞渲染）
requestAnimationFrame(() => {
fetchUserInfo().catch((error) => {
console.error('获取用户信息失败:', error);
});
});
// 3. 延迟执行：获取位置信息（可能较慢，不阻塞首屏）
requestAnimationFrame(() => {
requestAnimationFrame(() => {
getLocation().catch((error) => {
console.error('获取位置信息失败:', error);
});
});
});
}, []);
useEffect(() => {

8
src/static/message/comment-icon.svg
View File

@@ -1,10 +1,10 @@
<svg width="56" height="56" viewBox="0 0 56 56" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="56" height="56" rx="28" fill="#00EB47"/>
<g clip-path="url(#clip0_4975_26341)">
<path d="M43.7546 26.3183C43.7546 33.127 37.2195 38.7325 27.3619 38.7325C27.1843 38.7325 27.0066 38.7187 26.8288 38.705C26.6373 38.705 26.446 38.7734 26.2136 38.9376C23.8893 40.6054 19.8015 42.3965 18.1608 42.3965C17.1081 42.3965 16.8073 41.5351 17.3405 40.8516C17.86 40.1679 19.2272 38.6641 19.9929 37.4062C20.1022 37.2012 20.0339 36.9961 19.8288 36.8867C15.4401 34.5351 12.7468 30.6933 12.7468 26.3183C12.7468 19.4414 19.6374 13.8906 28.2507 13.8906C36.864 13.8906 43.7546 19.4414 43.7546 26.3183ZM32.7898 26.4414C32.7898 27.5762 33.7057 28.4922 34.8405 28.4922C35.9479 28.4922 36.8913 27.5762 36.8913 26.4414C36.8913 25.3066 35.9479 24.3906 34.8405 24.3906C33.7057 24.3906 32.7898 25.3066 32.7898 26.4414ZM26.1998 26.4414C26.1998 27.5762 27.1159 28.4922 28.2507 28.4922C29.3854 28.4922 30.3015 27.5762 30.3015 26.4414C30.3015 25.3066 29.3854 24.3906 28.2507 24.3906C27.1159 24.3906 26.1998 25.3066 26.1998 26.4414ZM19.6237 26.4414C19.6237 27.5762 20.5534 28.4922 21.6745 28.4922C22.7956 28.4922 23.7116 27.5762 23.7116 26.4414C23.7116 25.3066 22.7819 24.3906 21.6745 24.3906C20.5534 24.3906 19.6237 25.3066 19.6237 26.4414Z" fill="white" fill-opacity="0.85"/>
<rect width="56" height="56" rx="28" fill="#0EEEC1"/>
<g clip-path="url(#clip0_6243_26674)">
<path d="M42.5001 27.3352C42.5001 33.5453 36.5989 38.6581 27.6976 38.6581C27.5371 38.6581 27.3767 38.6455 27.2161 38.6331C27.0432 38.6331 26.8705 38.6954 26.6606 38.8451C24.5618 40.3664 20.8704 42 19.3889 42C18.4383 42 18.1667 41.2144 18.6482 40.5909C19.1173 39.9673 20.3519 38.5957 21.0433 37.4484C21.142 37.2614 21.0803 37.0743 20.8951 36.9745C16.9322 34.8297 14.5001 31.3256 14.5001 27.3352C14.5001 21.0628 20.7223 16 28.5001 16C36.2779 16 42.5001 21.0628 42.5001 27.3352ZM32.5989 27.4475C32.5989 28.4825 33.426 29.318 34.4507 29.318C35.4507 29.318 36.3025 28.4825 36.3025 27.4475C36.3025 26.4125 35.4507 25.577 34.4507 25.577C33.426 25.577 32.5989 26.4125 32.5989 27.4475ZM26.6482 27.4475C26.6482 28.4825 27.4754 29.318 28.5001 29.318C29.5247 29.318 30.352 28.4825 30.352 27.4475C30.352 26.4125 29.5247 25.577 28.5001 25.577C27.4754 25.577 26.6482 26.4125 26.6482 27.4475ZM20.7099 27.4475C20.7099 28.4825 21.5495 29.318 22.5618 29.318C23.5741 29.318 24.4013 28.4825 24.4013 27.4475C24.4013 26.4125 23.5618 25.577 22.5618 25.577C21.5495 25.577 20.7099 26.4125 20.7099 27.4475Z" fill="white" fill-opacity="0.85"/>
</g>
<defs>
<clipPath id="clip0_4975_26341">
<clipPath id="clip0_6243_26674">
<rect width="31.418" height="28.5059" fill="white" transform="translate(12.7468 13.8906)"/>
</clipPath>
</defs>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.5 KiB

After

Width:  |  Height:  |  Size: 1.4 KiB

95
src/store/keyboardStore.ts
View File

@@ -25,33 +25,13 @@ export const useKeyboardStore = create<KeyboardStore>((set, get) => ({
isInitialized: false,
setKeyboardHeight: (height: number) => {
// 直接更新状态，不触发监听器（监听器由 initializeKeyboardListener 统一处理）
set({ keyboardHeight: height })
const { listeners } = get()
// 使用 requestAnimationFrame 异步执行监听器，避免阻塞主线程
requestAnimationFrame(() => {
listeners.forEach(listener => {
try {
listener(height, get().isKeyboardVisible)
} catch (error) {
console.error('键盘监听器执行错误:', error)
}
})
})
},
setKeyboardVisible: (visible: boolean) => {
// 直接更新状态，不触发监听器（监听器由 initializeKeyboardListener 统一处理）
set({ isKeyboardVisible: visible })
const { listeners } = get()
// 使用 requestAnimationFrame 异步执行监听器，避免阻塞主线程
requestAnimationFrame(() => {
listeners.forEach(listener => {
try {
listener(get().keyboardHeight, visible)
} catch (error) {
console.error('键盘监听器执行错误:', error)
}
})
})
},
addListener: (listener: (height: number, visible: boolean) => void) => {
@@ -73,11 +53,59 @@ export const useKeyboardStore = create<KeyboardStore>((set, get) => ({
// 使用防抖优化，避免频繁触发
let lastHeight = 0
let lastTime = 0
const debounceDelay = 16 // 约一帧的时间
let pendingUpdate: { height: number; visible: boolean } | null = null
let rafId: number | null = null
const debounceDelay = 50 // 增加到50ms，减少更新频率
const applyUpdate = () => {
if (!pendingUpdate) return
const { height, visible } = pendingUpdate
const store = get()
// 批量更新，减少状态更新次数
if (visible) {
set({
isKeyboardVisible: true,
keyboardHeight: height
})
// 异步通知监听器
requestAnimationFrame(() => {
const { listeners } = get()
listeners.forEach(listener => {
try {
listener(height, true)
} catch (error) {
console.error('键盘监听器执行错误:', error)
}
})
})
} else {
set({
isKeyboardVisible: false,
keyboardHeight: 0
})
// 异步通知监听器
requestAnimationFrame(() => {
const { listeners } = get()
listeners.forEach(listener => {
try {
listener(0, false)
} catch (error) {
console.error('键盘监听器执行错误:', error)
}
})
})
}
pendingUpdate = null
rafId = null
}
Taro.onKeyboardHeightChange?.((res: any) => {
const height = Number(res?.height || 0)
const now = Date.now()
const visible = height > 0
// 防抖：如果高度没变化或时间间隔太短，忽略
if (height === lastHeight && (now - lastTime) < debounceDelay) {
@@ -87,18 +115,17 @@ export const useKeyboardStore = create<KeyboardStore>((set, get) => ({
lastHeight = height
lastTime = now
console.log('全局键盘高度变化:', height)
// 保存待更新的状态
pendingUpdate = { height, visible }
// 使用 requestAnimationFrame 延迟执行，避免阻塞消息处理
requestAnimationFrame(() => {
const store = get()
if (height > 0) {
store.setKeyboardVisible(true)
store.setKeyboardHeight(height)
} else {
store.setKeyboardVisible(false)
store.setKeyboardHeight(0)
}
// 取消之前的更新
if (rafId !== null) {
cancelAnimationFrame(rafId)
}
// 延迟执行更新，避免阻塞消息处理
rafId = requestAnimationFrame(() => {
requestAnimationFrame(applyUpdate)
})
})