ReactDOM.render 期望最后一个可选的“回调”参数是一个函数答案

【问题标题】：ReactDOM.render Expected the last optional `callback` argument to be a functionReactDOM.render 期望最后一个可选的“回调”参数是一个函数
【发布时间】：2017-01-28 23:37:09
【问题描述】：

我是新手，我写了下面的代码并得到了

ReactDOM.render Expected the last optional `callback` argument to be a function. `Instead received: Object`

这是我的代码

var Stats = React.createClass({
    render: function () {
        return (
            <article className="col-md-4">
                <article className="well">
                    <h3>{this.props.value}</h3>
                    <p>{this.props.label}</p>
                </article>
            </article>
        )
    }
});

ReactDOM.render(
    <Stats value={"255.5K"} label={"People engaged"}/>,
    <Stats value={"5K"} label={"Alerts"}/>,
    <Stats value={"205K"} label={"Investment"}/>,
    document.getElementById('stats')
);

我做错了什么？

【问题讨论】：

标签： javascript reactjs babeljs react-jsx jsx

【解决方案1】：

您需要提供一个反应元素作为第一个参数，准确地安装节点作为第二个参数。所以你可以这样做。

const LotsOfStats = React.createClass({
    render: function () {
        return (
            <div>
                <Stats value={"255.5K"} label={"People engaged"}/>
                <Stats value={"5K"} label={"Alerts"}/>
                <Stats value={"205K"} label={"Investment"}/>
            </div>
        );
    }
});

ReactDOM.render(
    <LotsOfStats />,
    document.getElementById('stats')
);

【讨论】：

【解决方案2】：

您给 ReactDom.render 四个参数 - 三个 Stats 组件和元素。该函数只需要在容器元素之前有一个元素。因此，您需要以某种方式将元素组合在一起，例如：

ReactDOM.render(
  <div>
    <Stats value={"255.5K"} label={"People engaged"}/>
    <Stats value={"5K"} label={"Alerts"}/>
    <Stats value={"205K"} label={"Investment"}/>
  </div>,
  document.getElementById('stats')
);

【讨论】：