React ref获取子组件的实例对象


reference可以在父组件中 直接得到子组件的实例对象(子--》父)

①指定ref
<son ref='mySon'></son>
②父组件通过ref调用子组件
this.refs.mySon

补充:
<input type='text' ref='myInput'/>
this.refs.myInput.value

<script type='text/babel'>
    // reference 引用 
     var Test = React.createClass({
       count:100,
       render:function(){
         return <div>
          <h2>这是一个子组件</h2>
         </div>
       }
     })

     var MyComponent = React.createClass({
       handleClick:function(){
         //借助于ref找到子组件做操作
        // console.log(this.refs.mySon.count)
           console.log(this.refs.mySon)
       },
       render:function(){
         return <div>
          <button onClick={this.handleClick}>获取子组件数据</button>
          <Test ref='mySon'></Test>
         </div>
       }
     })

     ReactDOM.render(
       <MyComponent></MyComponent>,
       document.getElementById('example')
     )
  </script>

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM