1// this is the complete code, copy and use
2
3import React from 'react';
4
5const API = 'https://geoip-db.com/json';
6const DEFAULT_QUERY = 'redux';
7
8class App extends React.Component {
9constructor(props) {
10super(props);
11
12 this.state = {
13 hits: [],
14isLoading: false,
15 };
16
17this.setStateHandler = this.setStateHandler.bind(this);
18
19}
20
21setStateHandler() {
22this.setState({ isLoading: true });
23
24fetch(API + DEFAULT_QUERY)
25 .then(response => {
26 if (response.ok) {
27 return response.json();
28 } else {
29 throw new Error('Something went wrong ...');
30 }
31 })
32 .then(data => this.setState({ hits: data.IPv4, isLoading: false }))
33 .catch(error => this.setState({ error, isLoading: false }));
34 }
35
36render() {
37return (
38<div>
39<button onClick = {this.setStateHandler}>Click</button>
40<h2>{this.state.hits}</h2>
41</div>
42);
43}
44}
45
46export default App;