-
Notifications
You must be signed in to change notification settings - Fork 1
/
redditPosts.js
47 lines (42 loc) · 1.05 KB
/
redditPosts.js
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
import React from 'react';
const RedditPost = ({ data }) =>
<div>
<a href={data.url} target="_blank" style={{color: "white", textDecoration: "none"}}>
{data.title}
</a>
</div>
export default class RedditPosts extends React.Component {
constructor() {
super();
this.state = { items: [] };
this.fetchReddit = this.fetchReddit.bind(this);
}
fetchReddit() {
// space, startups, frontend
fetch(`https://www.reddit.com/r/space.json`)
.then(result => {
result
.json()
.then(json => {
this.setState({ items: json.data.children.slice(0,8) });
});
});
}
render() {
const styles = {
padding: 10,
background: "black",
margin: "0 0 20px 0",
};
return(
<div>
<button style={styles} type="button" onClick={this.fetchReddit}>Fetch!</button>
{
this.state.items ?
this.state.items.map(item => <RedditPost data={item.data} key={item.data.id} />)
: ''
}
</div>
);
}
}