React獲取DOM方法


以下提供三種方法:

  1. js 常規dom操作方式,通過id獲取dom

2.react原生函數findDOMNode獲取dom

3.通過ref來定位一個組件,切記ref要全局唯一(類似id)

import React, { Component } from 'react';
import ReactDOM from 'react-dom';
 
class Index extends Component {
  onClick(event){
    console.log(event.target.value);
    // 第一種方式
    var submitObj = document.getElementById('submit');
    submitObj.style.color = 'green';
    // 第二種方式
    ReactDOM.findDOMNode(submitObj).style.color = 'yellow';
    // 第三種方式
    this.refs.submit.style.color = 'blue';
  }
  render(){
    return (
        <div>
          <input id='submit' ref='submit'
                 type='button' value='style'
                 onClick={this.onClick.bind(this)}/>
        </div>
    )
  }
}

ReactDOM.render(<Index/>,document.getElementById('container'));


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM