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

优化城市选择死循环

Browse Source
This commit is contained in:
Ultrame
2025-11-19 16:53:40 +08:00
parent 5ecb352d1b
commit 07c41e7fa9
1 changed files with 65 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files

109
src/components/HomeNavbar/index.tsx
View File

@@ -60,17 +60,32 @@ function CityPicker(props) {
*/ */
const HomeNavbar = (props: IProps) => { const HomeNavbar = (props: IProps) => {
const { config, onCityPickerVisibleChange, onScrollToTop } = props; const { config, onCityPickerVisibleChange, onScrollToTop } = props;
const { showInput = false, inputLeftIcon, leftIconClick, title, showTitle = false } = config || {}; const {
showInput = false,
inputLeftIcon,
leftIconClick,
title,
showTitle = false,
} = config || {};
const { getLocationLoading, statusNavbarHeightInfo } = useGlobalState(); const { getLocationLoading, statusNavbarHeightInfo } = useGlobalState();
const { gamesNum, searchValue, cities, area, updateArea, fetchGetGamesCount, refreshBothLists } = useListState(); const {
const { statusBarHeight = 0, navBarHeight = 44 } = statusNavbarHeightInfo || {}; gamesNum,
searchValue,
cities,
area,
updateArea,
fetchGetGamesCount,
refreshBothLists,
} = useListState();
const { statusBarHeight = 0, navBarHeight = 44 } =
statusNavbarHeightInfo || {};
const [cityPopupVisible, setCityPopupVisible] = useState(false); const [cityPopupVisible, setCityPopupVisible] = useState(false);
// 监听城市选择器状态变化，通知父组件 // 监听城市选择器状态变化，通知父组件
useEffect(() => { useEffect(() => {
onCityPickerVisibleChange?.(cityPopupVisible); onCityPickerVisibleChange?.(cityPopupVisible);
}, [cityPopupVisible, onCityPickerVisibleChange]); }, [cityPopupVisible]);
const userInfo = useUserInfo(); const userInfo = useUserInfo();
const province = (userInfo as any)?.province || ""; const province = (userInfo as any)?.province || "";
@@ -148,13 +163,13 @@ const HomeNavbar = (props: IProps) => {
<View <View
className="homeNavbar" className="homeNavbar"
style={{ style={{
position: 'fixed', position: "fixed",
top: 0, top: 0,
left: 0, left: 0,
width: '100%', width: "100%",
height: `${ navBarHeight}px`, height: `${navBarHeight}px`,
paddingTop: `${statusBarHeight}px`, paddingTop: `${statusBarHeight}px`,
backgroundColor: 'transparent', backgroundColor: "transparent",
zIndex: 99, zIndex: 99,
}} }}
> >
@@ -175,28 +190,28 @@ const HomeNavbar = (props: IProps) => {
${!showInput ? "visible" : ""}`} ${!showInput ? "visible" : ""}`}
style={navbarStyle} style={navbarStyle}
> >
<View className="listNavContentWrapper"> <View className="listNavContentWrapper">
{/* logo */} {/* logo */}
<Image <Image
src={img.ICON_LOGO} src={img.ICON_LOGO}
className="listNavLogo" className="listNavLogo"
onClick={handleLogoClick} onClick={handleLogoClick}
/> />
<View className="listNavLine" /> <View className="listNavLine" />
<View className="listNavContent"> <View className="listNavContent">
<View className="listNavCityWrapper" onClick={handleToggleCity}> <View className="listNavCityWrapper" onClick={handleToggleCity}>
{/* 位置 */} {/* 位置 */}
<Text className="listNavCity">{area_city}</Text> <Text className="listNavCity">{area_city}</Text>
{!getLocationLoading && area_city && ( {!getLocationLoading && area_city && (
<Image src={img.ICON_CHANGE} className="listNavChange" /> <Image src={img.ICON_CHANGE} className="listNavChange" />
)} )}
</View> </View>
<View className="listNavInfoWrapper"> <View className="listNavInfoWrapper">
<Text className="listNavInfo">附近{gamesNum}场球局</Text> <Text className="listNavInfo">附近{gamesNum}场球局</Text>
</View>
</View> </View>
</View> </View>
</View> </View>
</View>
)} )}
{/* 搜索导航 */} {/* 搜索导航 */}
@@ -207,30 +222,30 @@ const HomeNavbar = (props: IProps) => {
} ${showInput ? "inputCustomerNavbarShowInput" : ""}`} } ${showInput ? "inputCustomerNavbarShowInput" : ""}`}
style={navbarStyle} style={navbarStyle}
> >
<View className="navContent"> <View className="navContent">
{/* logo */} {/* logo */}
<Image
src={inputLeftIcon || img.ICON_LIST_INPUT_LOGO}
className="logo"
onClick={handleInputLeftIconClick}
/>
{/* 搜索框 */}
<View className="searchContainer">
<Image <Image
className="searchIcon icon16" src={inputLeftIcon || img.ICON_LIST_INPUT_LOGO}
src={img.ICON_LIST_SEARCH_SEARCH} className="logo"
/> onClick={handleInputLeftIconClick}
<Input
placeholder="搜索球局和场地"
className="navbarInput"
clearable={false}
disabled
value={searchValue}
onClick={handleInputClick}
/> />
{/* 搜索框 */}
<View className="searchContainer">
<Image
className="searchIcon icon16"
src={img.ICON_LIST_SEARCH_SEARCH}
/>
<Input
placeholder="搜索球局和场地"
className="navbarInput"
clearable={false}
disabled
value={searchValue}
onClick={handleInputClick}
/>
</View>
</View> </View>
</View> </View>
</View>
)} )}
</View> </View>
{cityPopupVisible && !showTitle && ( {cityPopupVisible && !showTitle && (