diff --git a/app/components/WeatherSearchForm.tsx b/app/components/WeatherSearchForm.tsx index ab0ac03..0744423 100644 --- a/app/components/WeatherSearchForm.tsx +++ b/app/components/WeatherSearchForm.tsx @@ -8,91 +8,73 @@ import { useWeatherStore } from '@/store/weatherStore'; export function WeatherSearchForm() { const {isLoading, currentWeather, searchWeather, refreshWeather} = useWeatherStore(); - const [city, setCity] = useState(''); const [inputError, setInputError] = useState(''); - const handleInputChange = (e: ChangeEvent) => { setCity(e.target.value); if (inputError) { setInputError(''); } - const handleFormSubmit = async (e: FormEvent) => { - e.preventDefault(); - const trimmedCity = city.trim(); - if (!trimmedCity) { - setInputError('请输入城市名称'); - return; - } + const handleFormSubmit = async (e: FormEvent) => { + e.preventDefault(); + const trimmedCity = city.trim(); + if (!trimmedCity) { + setInputError('请输入城市名称'); + return; + } + if (trimmedCity.length < 2) { + setInputError('请输入至少2个字符'); + return; + } + if (!/^[a-zA-Z\s]+$/.test(trimmedCity)) { + setInputError('请输入字母和空格'); + return; + } + await searchWeather(trimmedCity); - if (trimmedCity.length < 2) { - setInputError('请输入至少2个字符'); - return; - } - - if (!/^[a-zA-Z\s]+$/.test(trimmedCity)) { - setInputError('请输入字母和空格'); - return; - } - await searchWeather(trimmedCity); - - return ( -
-
-
-
- -
- -
- {inputError && ( -
- -

{inputError}

-
- - - ) - } - -
- - - {currentWeather && ( - - )} -
- - -
-
- - - + return ( +
+
+
+
+ +
+ +
+ {inputError && ( +
+ +

{inputError}

+
+ ) + } +
+ + {currentWeather && ( + + )} +
+
+
) } - } } \ No newline at end of file