在我学习的过程当中，总会被一些名词搞得晕头转向，但是细想起来又非常简单，比如定义的这个refs，其实就是用于获取dom的一种方式。

在React中组件并不是真实的 DOM 节点，而是存在于内存之中的一种，叫做虚拟 DOM （virtual DOM）。只有当它插入文档以后，才会变成真实的 DOM 。根据 React 的设计，所有的 DOM 变动，都先在虚拟 DOM 上发生，然后再将实际发生变动的部分，反映在真实 DOM上，这种叫做 DOM diff ，它可以极大提高网页的性能表现。

var MyComponent = React.createClass({  handleClick: function() {    this.refs.myTextInput.focus();  },  render: function() {    return (      
     
        
              
            
     
    );  }});ReactDOM.render(  
     ,  document.getElementById('example'));

上面代码中，组件 MyComponent 的子节点有一个文本输入框，用于获取用户的输入。这时就必须获取真实的 DOM 节点，虚拟 DOM 是拿不到用户输入的。为了做到这一点，文本输入框必须有一个 ref 属性，然后 this.refs.[refName] 就会返回这个真实的 DOM 节点。

通过这个ref我们同样可以获取input的输入值。就是这么简单。

但是使用过程中我们切记：由于 this.refs.[refName] 属性获取的是真实 DOM ，所以必须等到虚拟 DOM 插入文档以后，才能使用这个属性，否则会报错。上面代码中，通过为组件指定 Click 事件的回调函数，确保了只有等到真实 DOM 发生 Click 事件之后，才会读取 this.refs.[refName] 属性。

原文连接：http://blog.csdn.net/jiangbo_phd/article/details/51758148