React Refs

React 支持一种非常特殊的属性 Ref ,你可以用来绑定到 render() 输出的任何组件上。

这个特殊的属性允许你引用 render() 返回的相应的支撑实例( backing instance )。这样就可以确保在任何时间总是拿到正确的实例。

使用方法

绑定一个 ref 属性到 render 的返回值上:

在其它代码中,通过 this.refs 获取支撑实例:

你可以通过使用 this 来获取当前 React 组件,或使用 ref 来获取组件的引用,实例如下:

React 实例

React 中的 refs的应用的更多相关文章

  1. react中的refs

    概述 很久之前就知道refs,感觉好神秘,恰好今天突然发现字符串形式的ref在官网不推荐使用了,于是好好总结一下ref的用法,供以后开发时参考,相信对其他人也有用. 参考资料: Refs & ...

  2. 【React】282- 在 React 组件中使用 Refs 指南

    英文:Yomi Eluwande  译文:joking_zhang https://segmentfault.com/a/1190000019277029 使用 React 时,我们的默认思维方式应该 ...

  3. 在 React 组件中使用 Refs 指南

    原文:Fullstack React's Guide to using Refs in React Components作者:Yomi Eluwande译者:博轩 译文:https://segment ...

  4. react中input自动聚焦问题

    input自动聚焦问题 在react中可以使用refs解决这个问题,首先看一下refs的使用场景: (1)处理焦点.文本选择或媒体控制. (2)触发强制动画. (3)集成第三方 DOM 库. 使用re ...

  5. 九、React中的组件、父子组件、React props父组件给子组件传值、子组件给父组件传值、父组件中通过refs获取子组件属性和方法

    一.概述 React中的组件: 解决html 标签构建应用的不足. 使用组件的好处:把公共的功能单独抽离成一个文件作为一个组件,哪里里使用哪里引入. [父子组件]:组件的相互调用中,我们把调用者称为父 ...

  6. react中这些细节你注意过没有?

    react中的一些细节知识点: 1.组件中get的使用(作为类的getter) ES6知识:class类也有自己的getter和setter,写法如下: Class Component { const ...

  7. React中ref的使用方法

    React中ref的使用方法 在react典型的数据流中,props传递是父子组件交互的唯一方式:通过传递一个新的props值来使子组件重新re-render,从而达到父子组件通信.当然,就像reac ...

  8. React中setState学习总结

    react中setState方法到底是异步还是同步,其实这个是分在什么条件下是异步或者同步. 1.先来回顾一下react组件中改变state的几种方式: import React, { Compone ...

  9. react中父组件给子组件传值

    子组件 state = { msg: 'a' } render(){ return<h1>{this.state.msg}</h1> } setInfo = (val)=> ...

随机推荐

  1. Python for Xpath

    # Xpath- 在XML文件中查找信息的一套规则/语言,根据XML的元素或者属性进行遍历 ## Xpath开发工具- 开源的Xpath表达式编辑工具:XMLQuire- Chrome插件:Xpath ...

  2. Java工具类使用注意事项

    (以下摘自阿里巴巴Java开发手册) 1. [强制]获取单例对象需要保证线程安全,其中的方法也要保证线程安全. 说明:资源驱动类.工具类.单例工厂类都需要注意. 5. [强制]SimpleDateFo ...

  3. 1.1 Eclipse的安装

    下载地址:http://www.eclipse.org/downloads/packages/eclipse-ide-java-ee-developers/indigosr1 2.java jdk 的 ...

  4. js获取日期当天的开始时间和结束时间

    //函数调用传参格式为 2018-6-6或者2018.6.6//如:startUnix(2018-6-6) 返回的时间戳格式‘1528300799’ function startUnix($date) ...

  5. [SharePoint2010开发入门经典]SPS2010开发工具

    本章概要: 1.了解不同的开发SPS的方法 2.了解SPS开发工具和环境 3.使用VS2010和SPD还有Blend开发SPS

  6. 在IntelliJ IDEA中创建Web项目

    在IntelliJ IDEA中创建Web项目 在IntelliJ IDEA中创建Web项目1,创建Maven WebProject选择File>New>Project 出现New Proj ...

  7. Ruby中使用patch HTTP方法

    Ruby中使用patch HTTP方法 如果使用patch,在后台可以看到只更新了改动的部分: Started PATCH "/ads/5/update" for ::1 at 2 ...

  8. 从头认识java-13.5 利用泛型构建复杂模型

    这一章节我们来展示一下如何利用泛型构建复杂模型? 1.元组列表 我们之前已经说过元组是一个复杂的模型,能够返回多对象. package com.ray.ch11; import java.util.A ...

  9. POJ 1201 &amp; HDU1384 &amp; ZOJ 1508 Intervals(差分约束+spfa 求最长路径)

    题目链接: POJ:http://poj.org/problem?id=1201 HDU:http://acm.hdu.edu.cn/showproblem.php? pid=1384 ZOJ:htt ...

  10. android创建桌面快捷键shortcut

    有非常多人也写过创建桌面快捷键的blog.可是大部分都仅仅讲了怎么用,事实上技术使用起来都非常easy.可是你使用后下次还知道吗? 根本原因还是不清楚原理.今天我就来讲讲shortcut创建过程. 过 ...