ParentComponent.jsx:21 Uncaught TypeError: this.setState is not a function

[scheung38]

Related to :

Issue about example #157

But specifically when clicking on a day, it returns:

ParentComponent.jsx:21 Uncaught TypeError: this.setState is not a function

import React, {Component} from 'react';
import DateTimeField from 'react-bootstrap-datetimepicker';
import TrackerReact from 'meteor/ultimatejs:tracker-react';
import moment from 'moment';

import '/node_modules/react-bootstrap-datetimepicker/css/bootstrap-datetimepicker.min.css';

export default class ParentComponent extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            date: moment().format('YYYY-MM-DD HH:mm:ss'),
            format: "YYYY-MM-DD HH:mm:ss",
            inputFormat: "YYYY-MM-DD HH:mm:ss",
            mode: "date"
        };
    }
    // handleChange (newDate) {
    handleChange = (newDate) => {
        console.log("newDate", newDate);
        return this.setState({date: newDate}); <-Uncaught TypeError: this.setState is not a function
    }

    render() {
        const {date, format, mode, inputFormat} = this.state;
        return (
            <DateTimeField
                dateTime={date}
                format={format}
                inputFormat={inputFormat}
                onChange={this.handleChange}
                viewMode={mode}
            />);
    }
}

and called in App.jsx:

import React from 'react';
import ReactDOM from 'react-dom';
// TrackerReact is imported (default) with Meteor 1.3 new module system
import TrackerReact from 'meteor/ultimatejs:tracker-react';

import FutureTasksForm from './FutureTasksForm.jsx';
import FutureTaskSingle from './FutureTaskSingle.jsx';
import DateTimeField from 'react-bootstrap-datetimepicker';
import ParentComponent from './ParentComponent.jsx';

import '../../lib/collections.js';

export default class App extends React.Component {

    constructor() {
        super();

        this.state = {
            subscription: {
                future_tasks: Meteor.subscribe('all_future_tasks')
             },
        }
    }

    componentWillUnmount() {
        this.state.subscription.future_tasks.stop();
     }

     futuretasks() {
        return FutureTasks.find().fetch();
        //.fetch gives object
        //find gives cursor
    }

    render() {

        let res = this.futuretasks();

        if (res.length < 1) {
            return <div>
                <h1>Detecting jobs...</h1>
            </div>
        }

        console.log('this.futuretasks() is : ', this.futuretasks());

        return (
            <div>
                <h1>Currently the below changes are being tracked : {Session.get('test')}</h1>
                <FutureTasksForm />

                <ParentComponent />
                <ParentComponent />

                <ul className="resolutions">
                    {this.futuretasks().map( (futuretask)=> {
                        return  <FutureTaskSingle  key={futuretask._id} futuretask={futuretask} />
                    })}
                </ul>

            </div>
        )
    }
}

But if handleChange is now

handleChange = (newDate) => {

then

While processing files with ecmascript (for target web.browser):
client/components/ParentComponent.jsx:19:4: /client/components/ParentComponent.jsx: Missing class properties transform.