2.00 react ref dom元素 定义ref="xx" 引用 this.refs.xx也可以直接放子组件上 拒绝反向数据流

1

import React from 'react';
import ReactDom from 'react-dom';
class App extends React.Component {
  render() {
    return (
      <div>
        <h3>ref引用</h3>
        <div ref="b1">box1</div>
        <div ref="b2">box2</div>
        <input type="text" ref="t1" />

        <Child ref="comp1"></Child>
        <input type="button" value="按钮" onClick={this.checkDom} />
      </div>
    )
  }

  checkDom = () => {
    console.log(this.refs)
    this.refs.b1.style.background = 'red';
    // ehcarts.init(this.refs.b2)
    // let video = Video.init(this.refs.b2)
    // video.play()
    this.refs.t1.focus();
    onsole.log(this.refs.comp1)
    console.log(this.refs.comp1.state.msg)
    this.refs.comp1.show()

  }
}
class Child extends React.Component {
  state = { msg: '子数据' }
  show = () => {
    console.log('子方法')
  };
  render() {
    return (
      <div>
        <h3>子组件</h3>
      </div>
    )
  }
}
ReactDom.render(
  <App />,
  document.querySelector("#root")
);