react学习笔记(二)
在以类继承的方式定义的组件中,为了能方便地调用当前组件的其他成员方法或属性(如:this.state),通常需要将事件处理函数运行时的 this 指向当前组件实例。
绑定事件处理函数this的几种方法:
第一种方法:
run(){
alert(this.state.name)
}
<button onClick={this.run.bind(this)}>按钮</button>
第二种方法:
构造函数中改变
this.run = this.run.bind(this);
run(){
alert(this.state.name)
}
<button onClick={this.run>按钮</button>
第三种方法:
run=()=> {
alert(this.state.name)
}
<button onClick={this.run>按钮</button>
带参数的方法:
在用箭头函数的基础上用bind绑定this和要传的参数
<button onClick={this.run.bind(this,xx)>按钮</button>
react学习笔记(二)的更多相关文章
- React学习笔记(二) 组件状态
组件的状态(this.state): 组件免不了要与用户互动,React 的一大创新,就是将组件看成是一个状态机,一开始有一个初始状态,然后用户互动,导致状态变化,从而触发重新渲染 UI getIni ...
- React学习笔记--程序调试
React学习笔记 二 程序调试 前面我们搭建好了React的基本开发环境,可以编写基本的React js程序了.但完成的开发环境肯定包含调试器,怎么调试用React编写的JS程序呢?有浏览器,比 ...
- ES6学习笔记<二>arrow functions 箭头函数、template string、destructuring
接着上一篇的说. arrow functions 箭头函数 => 更便捷的函数声明 document.getElementById("click_1").onclick = ...
- React学习笔记 - 组件&Props
React Learn Note 4 React学习笔记(四) 标签(空格分隔): React JavaScript 三.组件&Props 组件可以将UI切分成一些独立的.可复用的部件,这样你 ...
- React学习笔记 - 元素渲染
React Learn Note 3 React学习笔记(三) 标签(空格分隔): React JavaScript 二.元素渲染 元素是构成react应用的最小单位. 元素是普通的对象. 元素是构成 ...
- React学习笔记 - JSX简介
React Learn Note 2 React学习笔记(二) 标签(空格分隔): React JavaScript 一.JSX简介 像const element = <h1>Hello ...
- React学习笔记 - Hello World
React Learn Note 1 React学习笔记(一) 标签(空格分隔): React JavaScript 前.Hello World 1. 创建单页面应用 使用Create React A ...
- 【React】react学习笔记02-面向组件编程
react学习笔记02-面向组件编程 面向组件编程,直白来说,就是定义组件,使用组件. 以下内容则简单介绍下组建的声明与使用,直接复制demo观测结果即可. 步骤: 1.定义组件 a.轻量组件-函 ...
- WPF的Binding学习笔记(二)
原文: http://www.cnblogs.com/pasoraku/archive/2012/10/25/2738428.htmlWPF的Binding学习笔记(二) 上次学了点点Binding的 ...
随机推荐
- vue组件局部与全局注册的区别
//局部注册 var mycomponent = new extend({ <!--Vue.extend()是Vue构造器的扩展,调用Vue.extend()我们将创建一个组件构造 ...
- 201621123075 week5 继承、多态、抽象类和接口
1. 本周学习总结 1.1 写出你认为本周学习中比较重要的知识点关键词 接口.abstract.implements.comparable 1.2 尝试使用思维导图将这些关键词组织起来.注:思维导图一 ...
- SQL语句复制父子级表数据
原始表Book数据如下: id为自增长整数,text为内容,pid为上级IDid text pid1 第一层 02 数学 03 第二层 14 语文 15 第三层 36 英语 3…………………… 现要求 ...
- 手把手教你实现一个 Vue 进度条组件!
最近在个人的项目中,想对页面之间跳转的过程进行优化,想到了很多文档或 npm 等都用到的页面跳转进度条,于是便想自己去实现一个,特此记录. 来看下 npm 搜索组件时候的效果: so 下面咱们一起动手 ...
- 使用RTL-SDR打开车门
在最近几年,入侵汽车在当代社会的黑客圈中成为热点,很多文章表明汽车产业还有很多东西等待完善,在本篇文章中,我会让你熟悉我一直研究的一些概念,以及如何在网状网络中使用一些便宜的部件渗透远程开门系统. 软 ...
- 新建虚拟机并与XShell连接(配置网卡)
新建虚拟机并与XShell连接 一.新建虚拟机 下一步 下一步 选择CentOS版本,我的CentOS镜像是6.5版本64位,所以我选择CentOS 6 64. 然后点击下一步 可以自行更改位置,然后 ...
- VS2008 快捷键大全
转载自 https://www.cnblogs.com/likebeta/archive/2013/02/20/2919224.html Ctrl+E,D ---- 格式化全部 ...
- jQuery ajax瀑布流加载静态的列表页面
1.加载一行数据 <script> //滚动加载事件 var Loadurl = "{$url}"; if(window.location.href !== Loadu ...
- Linux下常用工具
GUI篇 计算器gnome-calculator pdf阅读envince 虚拟机virtualbox vnc tigervnc-server and client 网络连接network-manag ...
- Centos 安装 python2.7.10以及pip
安装python2.7.10 1. 下载安装包并解压 wget https://www.python.org/ftp/python/2.7.10/Python-2.7.10.tgz tar -xf P ...