AndrewTrieu/fullstack-open
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Upload 2.19

Browse Source
This commit is contained in:
AndrewTrieu
2023-03-24 11:18:47 +02:00
parent 4a78a63b00
commit 794f2ecab7
1 changed files with 7 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
part2/countries/src/App.js
View File

@@ -9,7 +9,7 @@ const App = () => {
const CountryData = ({ country }) => { const CountryData = ({ country }) => {
return ( return (
<div> <div>
<h1>{country.name.common}</h1> <h1>{country.name.official}</h1>
<div>Capital: {country.capital}</div> <div>Capital: {country.capital}</div>
<div>Area: {country.area} km²</div> <div>Area: {country.area} km²</div>
<h3>Languages:</h3> <h3>Languages:</h3>
@@ -24,14 +24,19 @@ const App = () => {
}; };
const Countries = ({ showedCountries }) => { const Countries = ({ showedCountries }) => {
const [country, setCountry] = useState("");
if (showedCountries.length === 1) { if (showedCountries.length === 1) {
return <CountryData country={showedCountries[0]} />; return <CountryData country={showedCountries[0]} />;
} else if (showedCountries.length <= 10) { } else if (showedCountries.length <= 10) {
return ( return (
<div> <div>
{showedCountries.map((country) => ( {showedCountries.map((country) => (
<div key={country.name.official}>{country.name.common}</div> <div key={country.cca3}>
{country.name.common}{" "}
<button onClick={() => setCountry(country)}>show</button>
</div>
))} ))}
{country && <CountryData country={country} />}
</div> </div>
); );
} else if (showedCountries.length > 10) { } else if (showedCountries.length > 10) {