Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- import React from 'react';
- import Title from './EventSubComponents/Title';
- import SessionInfo from './EventSubComponents/SessionInfo';
- import SessionTime from './EventSubComponents/SessionTime';
- import Location from './EventSubComponents/Location';
- import Subscribers from './EventSubComponents/Subscribers';
- class EventNode extends React.Component {
- constructor(props) {
- super(props);
- this.state = {
- 'event': [],
- }
- }
- componentDidMount() {
- this.getEvent(this.props.location.selectedEventId);
- }
- getEvent(eventId) {
- fetch('/api/v.1.0/event/' + eventId, {mode: 'no-cors'})
- .then(function(response) {
- if(!response.ok) {
- console.log('Failed to get single event.');
- return;
- }
- return response.json();
- })
- .then((data) => {
- if (!data) {
- return;
- }
- this.setState({
- 'event': data
- })
- });
- }
- render() {
- return(
- <div className="event-wrapper">
- <Title
- title = { this.state.event.title }
- date = { this.state.event.start }
- />
- <SessionInfo
- distance = { this.state.event.distance }
- type = { this.state.event.type }
- />
- <SessionTime
- start = { this.state.event.start }
- end = { this.state.event.end }
- />
- <Location location = { this.state.event.start_location }/>
- <Subscribers
- subscribers = { this.state.event.subscribers }
- eventId = { this.state.event._id }
- />
- </div>
- );
- }
- }
- export default EventNode;
- import React from 'react';
- import moment from 'moment';
- class Title extends React.Component {
- constructor(props) {
- super(props);
- this.state = {
- 'title': '',
- 'date': '',
- }
- }
- componentDidMount() {
- console.log(this.props.title);
- console.log(this.props.date);
- // undefined both props.
- this.convertToTitleDate(this.props.date);
- this.setState({
- 'title': this.props.title
- })
- }
- convertToTitleDate(date) {
- var newDate = moment(date).format('dddd, Do MMMM')
- this.setState({
- 'date': newDate,
- });
- }
- render() {
- return (
- <div className="event-title-wrapper">
- <h1> { this.state.title } </h1>
- <div className="event-title-date"> { this.state.date } </div>
- </div>
- );
- }
- }
- export default Title;
Add Comment
Please, Sign In to add comment