什么是“只有ReactOwner才能有ref.”卑劣？
什么是“只有ReactOwner才能有ref.”卑劣？
提问于 2015-02-15 03:18:35
我有一个简单的react组件，其中有一个表单：
var AddAppts = React.createClass({
handleClick: function() {
var title = this.refs.title.getDOMNode().value;
....
var appt = {
heading: title
...
}
CalendarActions.addAppointment(appt);
},
render: function() {
return (
<div>
<label>Description</label>
<input ref="title"></input>
...
</div>
);
}
});
module.exports = AddAppts;我正在尝试在另一个react组件中render这个组件：
var AddAppt = require('./AddAppts');
render: function() {
return (
<div>
<AddAppt />
</div>
);
}但是我得到了这个错误：
Uncaught Error: Invariant Violation: addComponentAsRefTo(...): Only a ReactOwner can have refs. This usually means that you're trying to add a ref to a component that doesn't have an owner (that is, was not created inside of another component's `render` method). Try rendering this component inside of a new top-level component which will hold the ref.我已经用谷歌搜索过了，但我不知道我需要做些什么来解决这个问题。
回答 9
Stack Overflow用户
发布于 2015-09-08 02:09:14
这是为使用react和redux-devtools的人提供的参考，这些人正在接收OP的消息。你的结构看起来像
project
client
node_modules
react
redux-devtools
node_modules
react客户端中的代码将需要第一个react模块；redux-devtools中的代码将需要另一个react模块。react模块保持状态，并假定它具有所有状态。
你得到了OP的消息，因为你的状态被分成了两个react模块。我相信@asbjornenge指的就是这种情况。
我把客户端代码和webpack捆绑在一起，所以我用它来处理这个问题。通过将以下内容添加到webpack.config.js中，可以强制所有require和import始终使用第一个react
module.exports = {
...
resolve: {
alias: {
'react': path.join(__dirname, 'node_modules', 'react')
},
extensions: ['', '.js']
},
...
);如果在节点上运行非捆绑的代码时发生这种情况，我还没有考虑到我需要做什么。
Stack Overflow用户
发布于 2015-03-26 19:46:25
当我使用的组件模块安装了自己的react依赖项时，我遇到了这个错误。所以我使用了React的多个版本。
确保没有在package.json中的dependencies下列出react。
这就是我们有peerDependencies的原因;-)
Stack Overflow用户
发布于 2016-09-09 14:44:29
在开发使用npm link链接到测试项目的react模块时，我看到了这个错误。切换到常规依赖关系解决了这个问题。
看起来React不喜欢npm link。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/28519287
复制相关文章
相似问题