blob: 4a2715d08dac8d4682bf5ee5eb0c67a94a137d20 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
|
import React from 'react';
import logo from './logo.svg';
import './App.css';
export default class App extends React.Component {
constructor(props) {
super(props);
this.state = {
festivals: null ,
fetched:false,
};
}
fetchFestivals=()=>{
fetch('http://localhost/drupalmod2/festivals?_format=json', {
method: 'get',
headers: {'Content-Type': 'application/json'}
}).then(response=>response.json()).then(data=>{if(data)this.setState({fetched:true,festivals:data})})
}
componentDidMount=()=>{
this.fetchFestivals();
}
render(){
console.log(this.state.festivals)
return (
<div className="App">
<h1 style={{fontSize:'50px'}}>A PWA with Headless Drupal</h1>
<h1>Festivals</h1>
{this.state.fetched&&this.state.festivals&&this.state.festivals.map((item)=>{
return(<div key={item.nid[0].value} className='festival'>
<h2>{item.title[0].value}</h2>
<img src={item.field_festival_image[0].url} />
{item.body[0].value.substring(3,(item.body[0].value.length-12))}
</div>)
})}
</div>
)
}
}
|
