ReactJS如何循环动态命名的refs

Question

我正在查看为输入动态命名 refs 的代码行，其中“item”是从零开始的递增值。

"input type="text" ref={'name'+item} defaultValue={item} />"

我将如何遍历这些动态 ref 以提取值？我试过这个没有运气。它告诉我对象未定义。 （输入的长度将等于添加元素的数量）

var arr = this.state.inputs;
var arrayLength = arr.length;
for (var i = 0; i < arrayLength; i++) {
    var c = this.refs.name + i.value
    alert(c);
}

虽然，这确实有效，但它是动态的，所以我需要遍历它，而不是硬编码：

alert(this.refs.name0.value);
alert(this.refs.name1.value);
alert(this.refs.name2.value);

Answer 1

我相信您需要获取输入的 DOM 对象，而不仅仅是 refs（至少这是我的经验）：

import ReactDOM from 'react-dom';

const values = {}; 
Object.keys(this.refs)
    .filter(key => key.substr(0,4) === 'name')
    .forEach(key => {
        values[key] = ReactDOM.findDOMNode(this.refs[key])).value || null;
    });

祝你好运！