終于看到最后一章了悼吱。
你可以通過使用 this 來獲取當(dāng)前 React 組件,或使用 ref 來獲取組件的引用良狈,實例如下:
React 支持一種非常特殊的屬性 Ref 后添,你可以用來綁定到 render() 輸出的任何組件上。
這個特殊的屬性允許你引用 render() 返回的相應(yīng)的支撐實例( backing instance )薪丁。這樣就可以確保在任何時間總是拿到正確的實例遇西。
使用方法:
綁定一個 ref 屬性到 render 的返回值上
<input ref="myInput" />
import React, { Component } from 'react';
class From6 extends Component {
// 事件
handleClick(){
// 使用原生的 DOM API 獲取焦點
this.refs.myInput.focus();
}
render(){
// 當(dāng)組件插入到 DOM 后,ref屬性添加一個組件的引用到 this.refs
return(
<div>
<input type="text" ref="myInput"/>
<input
type="button"
value="點我可以讓輸入框獲取焦點哦"
onClick={this.handleClick.bind(this)}
/>
</div>
);
}
}
export default From6 ;
實例中严嗜,我們獲取了輸入框的支撐實例的引用粱檀,點擊按鈕后輸入框獲取焦點。
我們也可以使用 getDOMNode()方法獲取DOM元素漫玄。