react ref属性的简单运用

(1)例子要求:完成 Post 组件,接受一个字符串的 content 作为 props,Post 会把它显示到自己的

元素内。
并且,点击

元素的时候,会使用 console.log 把元素的高度打印出来。

const Post = props => {
  return (
    

{this.p = p} } onClick={ () => console.log(this.p.clientHeight) }> {props.content}

) }

( 2 ) 比如说你想进入页面以后自动 focus 到某个输入框,你需要调用 input.focus() 的 DOM API,比如说你想动态获取某个 DOM 元素的尺寸来做后续的动画

class AutoFocusInput extends Component {
  componentDidMount () {
    this.input.focus()
  }

  render () {
    return (
       this.input = input} />
    )
  }
}

你可能感兴趣的:(react ref属性的简单运用)