在以类继承的方式定义的组件中,为了能方便地调用当前组件的其他成员方法或属性(如: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学习笔记(二)的更多相关文章

  1. React学习笔记(二) 组件状态

    组件的状态(this.state): 组件免不了要与用户互动,React 的一大创新,就是将组件看成是一个状态机,一开始有一个初始状态,然后用户互动,导致状态变化,从而触发重新渲染 UI getIni ...

  2. React学习笔记--程序调试

    React学习笔记 二 程序调试   前面我们搭建好了React的基本开发环境,可以编写基本的React js程序了.但完成的开发环境肯定包含调试器,怎么调试用React编写的JS程序呢?有浏览器,比 ...

  3. ES6学习笔记<二>arrow functions 箭头函数、template string、destructuring

    接着上一篇的说. arrow functions 箭头函数 => 更便捷的函数声明 document.getElementById("click_1").onclick = ...

  4. React学习笔记 - 组件&Props

    React Learn Note 4 React学习笔记(四) 标签(空格分隔): React JavaScript 三.组件&Props 组件可以将UI切分成一些独立的.可复用的部件,这样你 ...

  5. React学习笔记 - 元素渲染

    React Learn Note 3 React学习笔记(三) 标签(空格分隔): React JavaScript 二.元素渲染 元素是构成react应用的最小单位. 元素是普通的对象. 元素是构成 ...

  6. React学习笔记 - JSX简介

    React Learn Note 2 React学习笔记(二) 标签(空格分隔): React JavaScript 一.JSX简介 像const element = <h1>Hello ...

  7. React学习笔记 - Hello World

    React Learn Note 1 React学习笔记(一) 标签(空格分隔): React JavaScript 前.Hello World 1. 创建单页面应用 使用Create React A ...

  8. 【React】react学习笔记02-面向组件编程

    react学习笔记02-面向组件编程 面向组件编程,直白来说,就是定义组件,使用组件. 以下内容则简单介绍下组建的声明与使用,直接复制demo观测结果即可. 步骤: 1.定义组件   a.轻量组件-函 ...

  9. WPF的Binding学习笔记(二)

    原文: http://www.cnblogs.com/pasoraku/archive/2012/10/25/2738428.htmlWPF的Binding学习笔记(二) 上次学了点点Binding的 ...

随机推荐

  1. POST形式 soapUI调用WebService的restful接口,传入json参数,并且返回json

    第一次使用POST形式传JSON字符串,怎么都调不到后台方法,只是因为注解没加对…… CXF的WebService接口类 package com.zit.webservice.main; import ...

  2. 大数据面试题——如何从大量的url中找出相同的url

    题目描述: 给定a.b两个文件,各存放50亿个url,每个url各占64B,内存限制是4GB,请找出a.b两个文件共同的url 分析: 由于每个url需要占64B,所以50亿个url占用空间大小为50 ...

  3. unity3d平铺图片

    using System;using System.Linq;using System.Text;using System.Reflection;using System.Collections;us ...

  4. SpringBoot的学习【2.分析HelloWorld的依赖】

    1.分析引入的父类项目 引入的父类如下. 点击进去发现又引入了一个父类 点击进去发现是spring的版本控制和相应的依赖. so~这就是springboot的终极大包.想用springboot开发的时 ...

  5. jenkins 持续集成iOS开发

    持续集成即Continuous Integration,简称CI 1,安装jenkins,brew install jenkins 2,在浏览器输入localhost:8080会出现一个网页,要求输入 ...

  6. 1.6 selenium3+firefox环境搭建

    1.6 selenium3+firefox环境搭建 有不少小伙伴在安装selenium环境后启动firefox报错,因为现在selenium升级到3.0了,跟2.0的版本还有有一点区别的.(备注:这里 ...

  7. “必须执行Init_Clk函数,才能采集到二氧化碳接口485数据的问题”的解决

    这个问题困扰了我很长一段时间,而且如果这个问题不解决,就有一个无法调和的矛盾:执行Init_Clk函数,能采集到二氧化碳接口485数据,但是功耗大:不执行Init_Clk函数,不能采集到二氧化碳接口4 ...

  8. scrapy框架之递归解析和post请求

    递归爬取解析多页页面数据 scrapy核心组件工作流程 scrapy的post请求发送 1.递归爬取解析多页页面数据 - 需求:将糗事百科所有页码的作者和段子内容数据进行爬取切持久化存储 - 需求分析 ...

  9. day05 集合

    今日进度(数据类型) 集合 内存相关 深浅拷贝 1.集合表示 1.无序 2.不重复 3.hash查找 #问题:v={}表示? set: v1=set()#空集合 v1={1,2,3,4,5} dict ...

  10. 我的代码-cleaning

    # coding: utf-8 # In[18]: import pandas as pdimport numpy as npfrom sklearn import treefrom sklearn. ...