I created a function that retun a city using public Ip address. Inside that function I get result but unable to get result into another react component.
getCity.js
const { publicIpv4 } = require("public-ip");
export async function currentCity() {
let ip = "";
let city = "";
// Get IP
try {
ip = await publicIpv4();
} catch (err) {
console.log(err);
}
// Get City From Ip and save
fetch(`https://ipapi.co/${ip}/json/`)
.then(function (response) {
response.json().then((jsonData) => {
// console.log(jsonData.city);
city = jsonData.city;
// console.log(`city: ${city}`);
});
})
.catch(function (error) {
console.log(error);
});
return city;
}
WeatherCard.js
import React, { useState } from "react";
import { currentCity } from "./getCity";
const WeatherCard = () => {
const [city, setCity] = useState("");
setCity(currentCity());
console.log(city);
return <div></div>;
};
export default WeatherCard;