ref屬性是訪問ReactJS應用程序中DOM的唯一方法嗎？

Question

組件的ref屬性是「逃離ReactJS世界」並且在ReactJS應用程序中工作時直接與DOM交互的唯一慣用方法嗎？

顯然，我可以做類似的componentDidMountdocument.querySelector，但除此之外...

Answer 1

class App extends React.Component{ 
 
    componentWillMount(){ 
 
     console.log(ReactDOM.findDOMNode(this)) 
 
    } 
 

 
    componentDidMount(){ 
 
     console.log(ReactDOM.findDOMNode(this)) 
 
    } 
 
    render(){ 
 
     return(
 
      <div>wefewfewfewfwefewf</div> 
 
     ) 
 
    } 
 
} 
 

 
ReactDOM.render(
 
    <App />,document.getElementById("app") 
 
)

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script> 
 
<div id="app"></div>

您可以使用ReactDOM.findDOMNode。它需要一個反應組件並返回一個底層的dom元素。

Answer 2

組件的ref屬性是「逃離ReactJS世界」的唯一慣用方法，並且在ReactJS應用程序中工作時直接與DOM交互？

不，你可以逃脫使用React.findDOMNode功能也實雖然建議使用refs代替。

refs和上述方法之外，我不認爲有任何其他的反應轉義的方法。這就是說，你也可以使用香草JavaScript來做到這一點，儘管這不是首選。