Commit 805f5040 authored by Duvara Nishaharan's avatar Duvara Nishaharan
Browse files

#8 parset json-dataen

parent 8bd1d071
......@@ -22,12 +22,12 @@ export const CountryCard: FunctionComponent<IProps> = ({
onClick={() => {store.getState().value!==id ? store.dispatch({ type: 'setState', newValue: id }) : store.dispatch({ type: 'setState', newValue: -1 });}}
bg="dark">
<Card.Body>
<Card.Title>{country.name}</Card.Title>
<Card.Title>{"ddd"+ country.name}</Card.Title>
<Card.Text>
{"ppl: " + country.population}
{"ppl: " + country.native}
</Card.Text>
{active && <>
<Card.Text>Area: {country.area}</Card.Text>
<Card.Text>Area: {country.continent}</Card.Text>
<Card.Text>Name: {country.name}</Card.Text>
</>
}
......
[
{
"AD": {
"name": "Andorra",
"native": "Andorra",
"phone": "376",
"continent": "EU",
"capital": "Andorra la Vella",
"currency": "EUR",
"languages": [
"ca"
]
},
"AE": {
"name": "United Arab Emirates",
"native": "دولة الإمارات العربية المتحدة",
"phone": "971",
"continent": "AS",
"capital": "Abu Dhabi",
"currency": "AED",
"languages": [
"ar"
]
},
"AF": {
"name": "Afghanistan",
"native": "افغانستان",
"phone": "93",
"continent": "AS",
"capital": "Kabul",
"currency": "AFN",
"languages": [
"ps",
"uz",
"tk"
]
},
"AG": {
"name": "Antigua and Barbuda",
"native": "Antigua and Barbuda",
"phone": "1268",
"continent": "NA",
"capital": "Saint John's",
"currency": "XCD",
"languages": [
"en"
]
},
"AI": {
"name": "Anguilla",
"native": "Anguilla",
"phone": "1264",
"continent": "NA",
"capital": "The Valley",
"currency": "XCD",
"languages": [
"en"
]
}
}
]
\ No newline at end of file
......@@ -4,6 +4,7 @@ import React from 'react';
import { Country } from '../../interfaces/Country';
import './SearchbarStore.tsx'
import { searchbarStore } from './SearchbarStore';
import countriesJson from './countries.json'
interface IProps {
items?: string[]
......@@ -12,6 +13,31 @@ interface IState {
active: boolean,
items: string[]
}
const jsonData = JSON.stringify(countriesJson)
const jsnobj= JSON.parse(jsonData)
//var newarray: Country[]= [];
//for (const [key, value] of Object.entries(jsnobj[0])) {
//var test =(`${key}: ${value}`);
// }
//for (let key in jsnobj[0]){
//let value = (Object.keys(jsnobj[0]))
//console.log(value)
//newarray.push(JSON.parse(key) as Country)
//}
//const newdata:Country[] = jsonData
export class Searchbar extends React.Component<IProps, IState> {
constructor(props: IState) {
......@@ -24,7 +50,7 @@ export class Searchbar extends React.Component<IProps, IState> {
}
onSearch() {
searchbarStore.dispatch({ type: 'setState', NewCountry: dummyData });
searchbarStore.dispatch({ type: 'setState', NewCountry: jsnobj });
}
render() {
return (
......@@ -42,14 +68,5 @@ function getDataFromBackEnd() {
return dummyData;
}
const dummyData: Country[] = [
{ name: "Norway", population: 20, area: 10 },
{ name: "Sweden", population: 25, area: 11 },
{ name: "Iceland", population: 5, area: 3 },
{ name: "England", population: 60, area: 14 },
{ name: "Sri Lanka", population: 55, area: 8 },
{ name: "USA", population: 120, area: 60 },
{ name: "Poland", population: 35, area: 14 },
{ name: "Japan", population: 110, area: 40 },
{ name: "Denmark", population: 26, area: 9 },
{ name: "Finland", population: 22, area: 12 },
]
export interface Country{
name: string,
population: number,
area: number
}
\ No newline at end of file
export interface Country {
name:string;
native:string;
phone:string;
continent:string;
capital:string;
currency:string;
languages:string[];
}
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment