2020-03-31
react中的ref的3种方式

react中ref的3种绑定方式

方式1: string类型绑定
类似于vue中的ref绑定方式,可以通过this.refs.绑定的ref的名字获取到节点dom
注意的是 这种方式已经不被最新版的react推荐使用,有可能会在未来版本中遗弃
 
 
方式2: react.CreateRef()
通过在class中使用React.createRef()方法创建一些变量,可以将这些变量绑定到标签的ref中
那么该变量的current则指向绑定的标签dom
 
 
方式3: 函数形式
在class中声明函数,在函数中绑定ref
使用这种方法可以将子组件暴露给父组件以使得父组件能够调用子组件的方法
 
 
通过函数的方法绑定ref可以将整个子组件暴露给父组件
 
 
 
注意: react并不推荐过度使用ref,如果能通过state做到的事情,就不应该使用 refs 在你的 app 中“让事情发生”。
过度使用ref并不符合数据驱动的思想
 

最新文章

  1. [转]html超链接打开的窗口大小
  2. js整理4
  3. windows 下用eclipse搭建java、python开发环境
  4. JavaScript到底是不是单线程
  5. [转]VC的DDK编译环境构建
  6. 说明&总目录
  7. ADO.NET+Access: 1,标准表达式中数据类型不匹配
  8. Linux find xargs rm .orig
  9. BZOJ_3527_[ZJOI2014]_力_(FFT+卷积)
  10. 【转】gcc warning: braces around scalar initializer (标量初始化的括号)
  11. 解决问题之,wp项目中使用MatchCollection正则表达式匹配出错
  12. linux视频学习5(top, 网络监控
  13. [译]百里挑一:21个优质Swift开源App
  14. 编写函数,接受一个string,返回一个bool值,指出string是否有5个或者更多字符,使用此函数打印出长度大于等于5的元素
  15. 飞跃式发展的后现代 Python 世界
  16. 使用ENCKEYS方法加密数据
  17. 字节输入流:io包中的InputStream为所有字节输入流的父类。
  18. POJ 2442 - Sequence - [小顶堆][优先队列]
  19. java笔试总结
  20. Android笔记:Button

热门文章

  1. 解决CentOS无法识别网卡问题
  2. C语言合法标识符(hud2024)
  3. 换个角度学习ASP.NET Core中间件
  4. ASP.NET Core on K8S学习之旅(14)Ingress灰度发布
  5. OpenStack的Swift组件详解
  6. Python 为什么不用分号作终止符?
  7. 5.Linux的启动过程和系统指令
  8. hashMap探析
  9. 五、Java - 集合
  10. 关于String是值传递还是引用传递