Error Objects are not valid as a React child (found: Invalid date)

Question

getting the error below, can anyone explain why I get this?

Objects are not valid as a React child (found: Invalid date). If you meant to render a collection of children, use an array instead or wrap the object using createFragment(object) from the React add-ons. Check the render method of DataGridRow.

Here is my render method:

render: function () {


    var columns = this.props.columns;
    var styles = {};

        if (this.props.data.isSensitive == true) {
            styles = {
                backgroundColor: 'pink'
            };
        }

        if (this.props.data.startDate) {

                var jsonWeek = moment(this.props.data.startDate, "W");
                var currentWeek = moment("W");
                if (currentWeek == jsonWeek) {

                    styles = {
                        backgroundColor: '#FCF2D8'
                    };

                }
        }

    return (
        <tr style={styles}>
            {this.getCellNodes()}
        </tr>
    );

}

Fakhruddin Abdi Fakhruddin Abdi · Accepted Answer · 2016-02-11T13:07:53

You should keep the following code in the Render function and move the others outside.

Use this.state to share a resource(in your case styles var) with render function.

     return (
        <tr style={styles}>
            {this.getCellNodes()}
        </tr>
    );

Error Objects are not valid as a React child (found: Invalid date)

2 Answers