react学习（17）回调形式的ref

<script type="text/babel">
        class Demo extends React.Component {
   
            render(){
   
                return (
                    <div>
                        <input type='text' ref={
   c=>this.input1 =c}/>&nbsp;
                        <button onClick={
   this.showDemo}>点击显示内容</button>
                    </div>
                )
            }
            showDemo=()=>{
   
                alert(this.input1.value);
            }
        }
        ReactDOM.render(<Demo/>,document.getElementById('test'));
    </script>

1：首先回调函数是指：自己定义了一个函数，并且这个函数不是自己调用且执行了，ref的回调函数是react帮忙执行。其中c是当前标签节点，this.input1中的this是组件实例对象。那么this.input1 =c;的含义就是往组件实例对象身上添加一个input1属性，并且值为标签节点。
2：回调形式的ref回调执行次数：如果写成内联函数的形式，在更新页面的时候，函数会调用两次。如果写成class的绑定函数的形式，就不会出现这种情况。但是大多数情况这是无关紧要的。

<input type='text' ref={
   this.saveInput}/>
saveInput=(c)=>{
   
    this.input1 = c;
}