zoukankan      html  css  js  c++  java
  • React中ref的使用方法

    React中ref的使用方法

      在react典型的数据流中,props传递是父子组件交互的唯一方式;通过传递一个新的props值来使子组件重新re-render,从而达到父子组件通信。当然,就像react官网所描述的一样,在react典型的数据量之外,某些情况下(例如和第三方的dom库整合,或者某个dom元素focus等)为了修改子组件我们可能需要另一种方式,这就是ref方式。

    1.ref有两种使用方法:

    1)回调函数

    标签中:<input type="text" className="form-control" ref={ref => this.name = ref}/>

    使用:let name=this.name.value;

    2)字符串

    标签中:<input type="text" className="form-control" ref="name"/>

    使用:let name=this.refs.name.value;

    2.三种触发回调函数的时机:

    1)组件被渲染后

    2)组件被卸载后

    3)ref改变后

    3.注:

      使用ref必须用在【类型式的组件】才起作用,用在【函数式的组件】是无效的。

  • 相关阅读:
    Python之socket_tcp
    Python之多进程&异步并行
    Qt forever关键字
    Qt程序在XP系统上不能正常运行
    Qt多线程的使用
    QScrollArea
    QtoolButton
    QComboBox
    Qt播放音频文件
    Qt5.9.1编译oracle驱动
  • 原文地址:https://www.cnblogs.com/Michelle20180227/p/9258992.html
Copyright © 2011-2022 走看看