React 0.14 migration error

[Volodymyr128]

Got the next error while migrated to 0.14 version:

Invariant Violation: Objects are not valid as a React child (found: object with keys {status, data, operationId, correlationId}). 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 exports.

Is it related to the next string in doc: Plain objects are no longer supported as React children; arrays should be used instead. You can use the createFragment helper to migrate, which now returns an array.? What I should change in the code below:

render() {
    const warningDialog = (<RegisterPopup />);
    return (
        <div className="app">
            <div className="view register-step">
                <Header
                    title={this.props.title}
                    progress={this.props.progress}
                    back={this.props.back}/>
                <div className="page">
                    <div className="page-inner">
                        <Content>
                            <form>
                                {this._getContent()}
                            </form>
                        </Content>
                        <Footer
                            buttonClassName={nextBtnClassName}
                            buttonText={this.props.buttonText}
                            clickHandler={this._next.bind(this, this.props.next)}/>
                    </div>
                </div>
                {warningDialog} //< ===== Here
            </div>
        </div>
    );
}

[quantizor]

@Volodymyr128 This was documented in the changelog - React doesn't accept objects as children anymore and you can use the createFragment API to convert your object into an array.

[jimfb]

@yaycmyk Sounds right to me, thanks for answering!

@Volodymyr128 This is a usage question rather than a bug in the React core. We use github issues for tracking bugs in the React core. Usage questions are better answered on StackOverflow. Since this is not a bug in the React core, I'm going to close this issue. Feel free to continue the discussion on this thread.

[sophiebits]

warningDialog is probably not the problem. We give you the keys (status, data, operationId, correlationId) so that the real callsite is easier to find.

[togakangaroo]

Not to resurrect this issue, but I can't find anywhere where this change is discussed. If you don't mind, what is the change behind it? Passing objects and arrays as children seemed completely natural to me and now everything is breaking...

[quantizor]

Arrays are still fine, but not POJOs. https://facebook.github.io/react/blog/2015/10/07/react-v0.14.html <- see the breaking changes section

[togakangaroo]

Right, what was the reasoning for this change? I'm not trying to be combative, just it screws up some patterns I've been using and I'd like to know the rationale.

[zpao]

We want to be able to treat an object as if it were a react element, which would allow a JSX transform to transform to objects directly instead of React.createElement function calls. We can't do that well if objects also have other meaning.