Quantcast
Channel: Active questions tagged react-native+typescript - Stack Overflow
Viewing all articles
Browse latest Browse all 6287

How to pass an Array in props React Native

$
0
0

I want to fetch a country's population from a json API. To do this, I'd like to pass in an array in props. In FetchPopulation, I use hooks to get the array latest and I return it. Then, in DataScreen, I declare the variable from FetchPopulation. However, the latest array is empty here. I know you can directly fetch the population from FetchPopulation, but I need the array for different purposes. How can I do this?

This is my current setup:

FetchPopulation.tsx

export const FetchPopulation = () => {const [latest, setLatest] = useState([]);useEffect(() => {      axios        .get("https://raw.githubusercontent.com/samayo/country-json/master/src/country-by-population.json"        )        .then((response) => {          setLatest(response.data);})        .catch((err) => {          console.log(err);        });    }  }, []);return {  latest,};};

DataScreen.tsx

const DataScreen = () => {  const { latest } = FetchPopulation();  return (<View><PopulationCard latest={latest} /></View>  )}

PopulationCard.tsx

type Props = {  latest: Array<Number>}const Population = (props: Props) => {   const countryArray = props.latest.filter(            (item) => item.country === mappedLocation.country,          );   const population = countryArray[0].population;   return (<View><Text>{population}</Text></View>   )}

Viewing all articles
Browse latest Browse all 6287

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>