41 lines
1,006 B
TypeScript
41 lines
1,006 B
TypeScript
import React, { Component } from 'react';
|
|
import ChannelService from '../../services/chanel';
|
|
|
|
import './ChannelList.scss';
|
|
|
|
export default class Channellist extends Component<any, any> {
|
|
service: ChannelService;
|
|
constructor(props: any) {
|
|
super(props);
|
|
this.state = {
|
|
loaded: false,
|
|
channels: [],
|
|
};
|
|
this.service = new ChannelService();
|
|
}
|
|
|
|
componentDidMount() {
|
|
fetch('http://haveachin.de:1888/v1/channels')
|
|
.then(res => res.json())
|
|
.then(data => this.setState({ channels: data, loaded: true }))
|
|
.catch(e => console.log(e));
|
|
}
|
|
public render() {
|
|
const { loaded, channels } = this.state;
|
|
console.log(this.state);
|
|
if (!loaded) {
|
|
return <div className='loading'>Loading...</div>;
|
|
} else {
|
|
return (
|
|
<ul className='channelList'>
|
|
{channels.map((e: Channel) => (
|
|
<li>
|
|
<span>#{e.id} </span>
|
|
{e.name}
|
|
</li>
|
|
))}
|
|
</ul>
|
|
);
|
|
}
|
|
}
|
|
}
|