Hello Folks,
I feel like stuck with this. I am developing the ‘Wikipedia Viewer’ in React. Here is my code to fetch data,
getSearchTerm = (term) => {
fetch(
`https://cors-anywhere.herokuapp.com/https://en.wikipedia.org/w/api.php?action=opensearch&format=json&search=${term}`
).then(
(response) => {
if(response.ok){
return response;
}else{
console.log('no response');
}
}
).then(data => data.json()).then(data => {
console.log(data)
this.setState({wikidata: data});
});
}
render(){
return (
<div>
<ShowSearchResult wikiData={this.state.wikidata}/>
</div>
);
}
This all working fine as in my console log I am getting right output such as,
Array(4)
0: "metadata"
1: (10) ["Metadata", "Metadata registry", "Metadata standard", "Metadata Encoding and Transmission Standard", "Metadata discovery", "Metadata Object Description Schema", "Metadata publishing", "Metadata repository", "Metadata modeling", "Metadata management"]
2: (10) ["Metadata is "data [information] that provides info…ata, reference metadata and statistical metadata.", "A metadata registry is a central location in an or…are stored and maintained in a controlled method.", "A metadata standard is a requirement which is inte…terpretation of the data by its owners and users.", "The Metadata Encoding and Transmission Standard (M… language of the World Wide Web Consortium (W3C).", "In metadata, metadata discovery (also metadata har…ver the semantics of a data element in data sets.", "The Metadata Object Description Schema (MODS) is a…ngress' Network Development and Standards Office.", "Metadata publishing is the process of making metad…ess and a commitment to change control processes.", "A metadata repository is a database created to sto…bout the structures that contain the actual data.", "Metadata modeling is a type of metamodeling used i…and useful for some predefined class of problems.", "Metadata management involves managing metadata abo…r data" is generally referred to as content data."]
3: (10) ["https://en.wikipedia.org/wiki/Metadata", "https://en.wikipedia.org/wiki/Metadata_registry", "https://en.wikipedia.org/wiki/Metadata_standard", "https://en.wikipedia.org/wiki/Metadata_Encoding_and_Transmission_Standard", "https://en.wikipedia.org/wiki/Metadata_discovery", "https://en.wikipedia.org/wiki/Metadata_Object_Description_Schema", "https://en.wikipedia.org/wiki/Metadata_publishing", "https://en.wikipedia.org/wiki/Metadata_repository", "https://en.wikipedia.org/wiki/Metadata_modeling", "https://en.wikipedia.org/wiki/Metadata_management"]
length: 4
__proto__: Array(0)
Where my search term is ‘metadata’ . The output looks to me as, it is an array object, that again contains 3 arrays , each has 10 entries.
However, in my ‘ShowSearchResult’ class when I am trying to parse the data , I am getting error. The ‘render’ method where the parsing is happening looks like,
render(){
//console.log('ShowSearchResult = ' + this.props.wikiData[3]);
const dataObj = this.props.wikiData[3];
if(dataObj){
dataObj.foreach((element)=>console.log('Hello'));
}
Just for testing, I was trying to parse the 3rd array, that contains 10 urls. But the line,
dataObj.foreach
irself throwing error such as,
ShowSearchResult.js:10 Uncaught TypeError: dataObj.foreach is not a function
at ShowSearchResult.render (ShowSearchResult.js:10)
..............
..............
I really feel very stuck in this. I converted the data in JSON but still couldn’t parse. What I am missing can’t really get . therefore, any help is very much appreciated.