Question

我正在尝试使用react-data-grid（http://adazzle.github.io/react-data-grid/index.html），但我一直收到错误：

invariant.js:17 Uncaught Invariant Violation: addComponentAsRefTo(...): Only a ReactOwner can have refs. You might be adding a ref to a component that was not created inside a component's `render` method, or you have multiple copies of React loaded.

我尝试卸载软件包并重新安装无济于事。

这是我的代码：

render() {
    ...
    var _rows = [];
        for (var i = 1; i < 1000; i++) {
            _rows.push({
                id: i,
                title: 'Title ' + i,
                count: i * 1000
            });
        }

        var rowGetter = function(i){
            return _rows[i];
        };

        const columns = [
            {
                key: 'id',
                name: 'ID'
            },
            {
                key: 'title',
                name: 'Title'
            },
            {
                key: 'count',
                name: 'Count'
            }
        ]
   return (
        ...
<ReactDataGrid
                                columns={columns}
                                rowGetter={rowGetter}
                                rowsCount={_rows.length}
                                minHeight={277} />
...
   )
}

我该如何解决这个问题？

我改变了我的config.js：

...
"npm:react-data-grid@0.14.42": {
      "classnames": "npm:classnames@1.2.2",
      "es5-shim": "npm:es5-shim@4.5.8",
      "fbjs": "npm:fbjs@0.6.1",
      "object-assign": "npm:object-assign@2.1.1",
      "process": "github:jspm/nodelibs-process@0.1.2",
      //"react": "npm:react@0.14.8",
      "react-contextmenu": "npm:react-contextmenu@1.5.0",
      //"react-dom": "npm:react-dom@0.14.8",
      "ron-react-autocomplete": "npm:ron-react-autocomplete@3.0.1"
    },
...

现在它有效。

Answer 1

或者您已经加载了多个React副本。

每次我收到此错误都是因为我已经反应加载两次，请确保您只加载React一次，特别是如果您使用webpack

未捕获的不变违规：addComponentAsRefTo（...）：只有ReactOwner可以有refs

1 个答案: