通过refs设置为变量来反应查找DOM节点？

Question

I am dynamically creating multiple text inputs (with dynamically created refs) along side the text that I want updated with the input.

I am trying to get the value of the input by setting the ref to a variable and finding the DOM node with React.findDOMNode(this.refs.Variable).value

I am getting a "Cannot read property 'value' of null" error.

How can I achieve this?

This is what the function looks like:

resetUnit: function(e){
  var refID = e.target.id;
  var ID = refID.split("-")[0];
  var Value = React.findDOMNode(this.refs.refID).value;
  NodesCollection.update({_id: ID},{$set: { materialUnit : Value}});
  this.setState({
    edit: ''
  });
},

Answer 1

var Value = React.findDOMNode(this.refs.refID).value;

finds the DOM node for the component with the ref "refID" . If you want to find the DOM node for the component with the ref refID (the variable), you need

var Value = ReactDOM.findDOMNode(this.refs[refID]).value;

Answer 2

I had to do

import ReactDOM from 'react-dom';
ReactDOM.findDOMNode(this.refs.hi);

in React 15.2.1 ( https://facebook.github.io/react/docs/top-level-api.html#reactdom.finddomnode )

Answer 3

I am getting a "Cannot read property 'value' of null" error.

Two possible cases:

• the id is wrong. Review further code or log to double check the ID is what you think it is
• Called to early: Are you sure that componentDidMount has been called?