REACT JS - 最终我的 adeventlistener 工作，最终不

Question

我的代码中发生了什么？基本上，我尝试在我的提交按钮上使用 try/catch，但没有任何响应，除非我“随机”更改代码和 ctrl+z，这很奇怪。你们能帮帮我吗？

function Search() {
    const apiKey = '34a37e23f7b13413d266dd15e21f63f8'
    const apiUrl = "https://api.openweathermap.org/data/2.5/weather?units=metric&q="
   
    const searchBox = document.querySelector('.search input')
    const searchBtn = document.querySelector('.search button')
    const weatherIcon = document.querySelector(".weather-icon")  
    
  
        
    async function checkWeather(cidade) {
        const response = await fetch(apiUrl + encodeURIComponent(cidade) + "&appid=" + apiKey)
        const data = await response.json()
        
        document.querySelector('.cidade').innerHTML = data.name
        document.querySelector('.temperatura').innerHTML = Math.round(data.main.temp) + "  °C"
        document.querySelector('.umidade').innerHTML = data.main.humidity + "%"
        document.querySelector('.vento').innerHTML = Math.round(data.wind.speed) + "km/h"
        console.log(data)

        if (data.weather[0].main == 'Clouds') {
            weatherIcon.src = cloud
        } else if (data.weather[0].main == 'Clear') {
            weatherIcon.src = sun
        } else if (data.weather[0].main == 'Rain') {
            weatherIcon.src = rain
        } else if (data.weather[0].main == 'Drizzle') {
            weatherIcon.src = drizzle
        }
        document.querySelector('.weather').style.display = "block"
    }
        
try{
    searchBtn.addEventListener("click", ()=>{
        checkWeather(searchBox.value)
        console.log('funfou')})    
} catch(e) {

}
}
export default Search

我尝试将其更改为外部 try catch 块，但反应说它无法工作