javascript - componentInstance.setState在0.11.0中未定义

我在名为DashboardPosition.js的文件中具有以下组件：

var DashboardPosition = React.createClass({
    getInitialState: function() {
        return {
            items: []
        };
    },
    render: function() {
        return (
            <div className="well well-sm dashboard-item">
                This component has {this.state.items.length} items
            </div>
        );
    }
});

然后，我将其呈现在页面中没有任何问题，如下所示：

var dashboardPosition = <DashboardPosition />;
React.renderComponent(dashboardPosition, document.querySelector("#position"));

但是当我尝试以下操作时：

var dashboardPosition = <DashboardPosition />;

React.renderComponent(dashboardPosition, document.querySelector("#position"));

dashboardPosition.setState({
    items: [{name: "AMD"}, {name: "LIQ"}, {name: "ELEC"}]
});

我收到以下错误：

Uncaught TypeError: undefined is not a function
    dashboardPosition.setState

这似乎仅在v0.11.0中发生。我已经在v0.10.0中尝试过了，并且效果很好。可能的错误或我错过了什么？

最佳答案

这是从0.10.0开始的更改，它在开发版本中向您发出警告，而在0.11.0中则是“重大更改”。

当您创建一个组件的实例时，返回的是一个描述符，这就是呈现该组件所需的任何反应。以前的0.10.0恰好是实际的虚拟dom节点，这导致了许多反模式，并消除了能够优化某些事物的潜在反应。您不能再对返回的值做任何事情，除了：


从渲染函数返回它们
使用cloneWithProps附件制作更新的副本


如果需要在DashboardPosition组件上设置setState，则需要在DashboardPosition内进行设置。

如果在DashboardPosition中执行此操作没有意义，则应传递items作为道具，例如<DashboardPosition items={items} />，并使用this.props.items代替this.state.items。