Rails/React：Refs 必须有所有者答案

【问题标题】：Rails/React: Refs Must Have OwnerRails/React：Refs 必须有所有者
【发布时间】：2017-07-14 17:52:56
【问题描述】：

我正在使用 react-rails gem。在我的组件中，我有两个输入字段，每个字段都有一个 ref。但是，控制台向我抛出以下错误：

未捕获的错误：addComponentAsRefTo(...): Only a ReactOwner can have 参考文献。您可能正在向未创建的组件添加 ref 在组件的 render 方法中，或者您有多个副本反应加载

Facebook 的文档没有帮助。

_new_item.js.jsx

var NewItem = React.createClass({
    handleClick() {
        var name = this.refs.name.value;
        var description = this.refs.description.value;

       console.log('The name value is ' + name + 'the description value is ' + description);

    },

    render() {
        return (
            <div>
                <input ref='name' placeholder='Enter the name of the item' />
                <input ref='description' placeholder='Enter a description' />
                <button onClick={this.handleClick}>Submit</button>
            </div>
        );
    } 
});

_body.js.jsx

var Body = React.createClass({
    render() {
        return (
            <div>
                <NewItem />
                <AllItems />
            </div>
        );
    } 
});

_main.js.jsx

var Main = React.createClass({
    render() {
        return (
            <div>
                <Header />
                <Body />
            </div>
        );
    }
});

我真的不知道错误在哪里。

【问题讨论】：

标签： javascript ruby-on-rails reactjs

【解决方案1】：

你最好使用函数 refs 而不是命名的 refs：

所以不是

<input ref='name' />

你可以使用：

<input ref={node => this.nameElement = node} />

然后代替：

this.refs.name

使用

this.nameElement

我相信它会解决你的问题。

【讨论】：