I would like to get the "weatherdata" parameter from GetDatas() function in my h4. I have been trying for a while now, but I don't know how to do it.

function GetDatas(e){
        e.preventDefault();
        console.log(cityname)
         fetch(cityURI)
        .then(city => city.json())
        .then(citydata => {
        fetch(`http://api.openweathermap.org/data/2.5/forecast?lat=${citydata[0].lat}&lon=${citydata[0].lon}&appid=${key}`)
            .then(weatherdata => weatherdata.json())
            .then(weatherdata => {
                return weatherdata
            })
        });
    }

       return (
        <div className="cityinput">
            <form onSubmit={() => {GetDatas();}}>
                <label >City name</label>
            <input type="text" onChange={(e) => SetCityname(e.target.value)} />
            </form>
            <div>
                <h4>Name: {weatherdata.name}</h4>
            </div>
        </div>
    );