为了获取真实的dom节点,文本输入框必须有一个 ref 属性,然后 this.refs.[refName] 就会返回这个真实的 DOM 节点。

var MyComponent = React.createClass({
handleClick: function() {
this.refs.myTextInput.focus();
},
render: function() {
return (
<div>
<input type="text" ref="myTextInput"/>
<input type="button" value="Focus the text input" onClick={this.handleClick} />
</div>
);
}
}); ReactDOM.render(
<MyComponent />,
document.getElementById('example')
);

  

react.js 获取真实的DOM节点的更多相关文章

  1. react入门-----(jsx语法,在react中获取真实的dom节点)

    1.jsx语法 var names = ['Alice', 'Emily', 'Kate']; <!-- HTML 语言直接写在 JavaScript 语言之中,不加任何引号,这就是 JSX 的 ...

  2. js学习总结:DOM节点二(dom基本操作)

    一.DOM继承树 DOM——Document Object Model DOM定义了表示修改文档所需要的方法.DOM对象即为宿主对象,由浏览器厂商定义,用来操作html和xml的一类厂商定义,也有人称 ...

  3. angular.js 动态插入删除dom节点

    angular.js 是新一代web开发框架,它轻松在web前端实现了MVC模式,相比 jquery 模式,这种新玩意竟然不需要开发者直接去操作dom . 作为前端开发而不去操作dom ,这简直是一个 ...

  4. JS中级 - 01:DOM节点

    1元素属性   1.1childNodes 返回元素的一个子节点的数组 (不推荐,建议用非标准children代替) 提醒:只包含一级子节点,不包含后辈孙级别以下节点. children:返回元素的一 ...

  5. js学习总结:DOM节点一(选择器,节点类型)

    DOM:document object model 文档对象模型 DOM就是整个HTML文档的关系图谱(代表整个HTML文档),可以理解为下图: 一.查看元素节点 1.document.getElem ...

  6. js 获取元素所有兄弟节点实例

    比如一个ul里面有10个li,而第3个li上有特殊的样式(比如颜色为红色,其他为黑色).我想把其他所有li——不包括红的li——的颜色也设为红色,此时,就需要获得红li的所有兄弟节点. 兄弟,就是和你 ...

  7. vue 钩子函数中获取不到DOM节点

    原文链接:https://jingyan.baidu.com/article/f96699bbfe9c9d894f3c1b4b.html 两种解决方案: 1:官方解决方案: 受到 HTML 本身的一些 ...

  8. js获取和设置DOM样式函数cssStyle(类似于jquery的$(elem).css())

    如题,相信这个函数百度一搜一大推,但令人匪夷所思的是这些函数都写的“奇形怪状的”,例如http://www.cnblogs.com/windows7/archive/2010/03/30/170064 ...

  9. JS获取树的父节点及祖先节点

    主体函数 export function findAllParent (node, tree, parentNodes = [], index = 0) { if (!node || node.fid ...

随机推荐

  1. 将 Callout 容器添加到移动设备应用程序中

    在移动设备应用程序中,callout 是在应用程序顶部弹出的容器.该容器可以容纳一个或多个组件,并且支持不同类型的布局. callout 容器可以是模态或非模态容器.模态容器在其关闭之前接受所有的键盘 ...

  2. FMS+NGINX打造高带宽利用率的流媒体(音频+视频)环境

    fms自身已经拥有了httpd,用来给客户端访问用,例如通过http的音频播放.众所周知,非专业的httpd自然有不专业之处,例如我遇到的情况就是经常http服务假死,或者在访问量庞大的时候会无缘无故 ...

  3. Nagios 系统监控基本安装配置过程详解

    Nagios 是一款免费的开源 IT 基础设施监控系统,功能强大,灵活性强,能有效监控 Windows.Linux.VMware 和 Unix 主机状态,交换机.路由器等网络设置等.一旦主机或服务状态 ...

  4. 微信小程序之快速接入七牛云

    小程序为什么要接入云? 目前,开发者在开发小程序过程中,主要遇到以下几个问题: 小程序发布大小超限 微信官方限制小程序的发布代码不能超过 1MB,而在实际开发过程中,一般的小程序难免会有图片等富媒体文 ...

  5. B+树的插入、删除(附源代码)

    B+ Tree Index B+树的插入 B+树的删除 完整测试代码 Basic B+树和B树类似(有关B树:http://www.cnblogs.com/YuNanlong/p/6354029.ht ...

  6. ssh配置文件及问题解决

    一 ssh的配置文鉴模板 Host AAA User gitolite3 HostName IP地址 IdentityFile ~/.ssh/key 二 下载代码的方法 1 ssh git2 git ...

  7. EM and GMM(Theory)

    Part 1: Theory 目录: What's GMM? How to solve GMM? What's EM? Explanation of the result What's GMM? GM ...

  8. JSP 学习一

    今天开始JSP的学习,作为Web开发人员,对JSP的开发是必不可少的,因此有必要对JSP进行掌握和学习:为此开始JSP的学习: 今日目标: 1)什么是JSP? 2)JSP的运行机制? 3)JSP的三种 ...

  9. Redis服务器搭建

    下载并解压redis,然后进入redis所在目录   编译安装             make && make install   启动redis 服务 (加上&表示在后台运 ...

  10. 架构师之路——里氏替换原则LSP

    定义: 如果对每一个对类型为S的对象o1,都有类型为T的对象o2,使得以T定义的所有程序P在所有的对象o1都代换成o2时,程序P的行为没有发生变化,那么类型S是类型T的子类型. 内容: 里氏替换原则通 ...