class实例方法

利用箭头函数的class实例方法

//导入react
import React from 'react'
 
import ReactDOM from 'react-dom'
//导入组件
 
// 约定1:类组件必须以大写字母开头
 
// 约定2:类组件应该继承react.component父类 从中可以使用父类的方法和属性
 
// 约定3:组件必须提供render方法
 
// 约定4:render方法必须有返回值
 
class HelloWorld extends React.Component {
    //初始化state
 
    state = {
        geyao: 0,
    }
    constructor(){
        super()
        
    }
    //抽离出来 this报错 事件处理中的this为underfine
    handleNum=()=>{
        this.setState({
            geyao: this.state.geyao + 1,
        })
    }
    render() {
        return (
            <div>
                <h1>{this.state.geyao}</h1>
                <button onClick={this.handleNum}>点击加一</button>
            </div>
        )
    }
}

好客租房32-事件绑定this指向(class实例方法)的更多相关文章

  1. 好客租房31-事件绑定this指向(bind)

    事件this指向bind 利用ES5中bind方法 将事件处理程序中的this和组件实例绑定在一起 //导入react     import React from 'react'           ...

  2. 好客租房30-事件绑定this指向(箭头函数)

    1箭头函数 利用箭头函数自身不绑定this的特点 //导入react     import React from 'react'           import ReactDOM from 'rea ...

  3. 好客租房33-事件绑定this指向(总结)

    1推荐使用class的实例方法 //导入react import React from 'react'   import ReactDOM from 'react-dom' //导入组件   // 约 ...

  4. 好客租房24-react中的事件处理(事件绑定)

    3.1事件绑定 React事件绑定语法和DOM事件语法相似 语法:on+事件名称={事件处理程序} 比如οnclick={()=>{}} //导入react     import React f ...

  5. IE attachEvent事件处理程序(事件绑定的函数)的this指向的是window不是执行当前事件的dom元素

    IE attachEvent事件处理程序(事件绑定的函数)的this指向的是window不是执行当前事件的dom元素. attachEvent(type,listener); listener函数中的 ...

  6. 事件绑定+call apply指向

    JS高级 事件—— 浏览器客户端上客户触发的行为都称为事件 所有事件都是天生自带的,不需要我们去绑定,只需要我们去触发,通过obj.事件名=function(){ } 事件名:onmousemove: ...

  7. JavaEE在职加薪课好客租房项目实战视频教程

    JavaEE在职加薪课好客租房项目实战视频教程课程介绍:       本课程采用SOA架构思想进行设计,基于目前主流后端技术框架SpringBoot.SpringMVC.Mybaits.Dubbo等来 ...

  8. Vue - 事件绑定

    1.内联方式: A:将事件处理器绑定到一个方法中,以下所有事件都以click事件作为案例 注意:内联方式下事件处理器只能绑定一个方法,要是想要绑定多个方法,依旧还是使用js中的addEventList ...

  9. 深入学习jQuery事件绑定

    × 目录 [1]bind [2]trigger [3]delegate[4]on[5]one 前面的话 javascript有HTML.DOM0级.DOM2级和IE这四种事件处理程序,而jQuery对 ...

随机推荐

  1. W3School 教程整理

    离线版大部分整理自 w3cschool ,少部分整理自 w3school ,由本人整理. 感谢 w3cschool 站长的无私奉献. 由于本人精力有限,此处的列表不一定能够及时更新,最新版本请到本人博 ...

  2. Spark入门之环境搭建

    本教程是虚拟机搭建Spark环境和用idea编写脚本 一.前提准备 需要已经有搭建好的虚拟机环境,具体见教程大数据学习之路又之从小白到用sqoop导出数据 - 我试试这个昵称好使不 - 博客园 (cn ...

  3. js读取cookie 根据cookie名称获取值的方法

    //方法1 //存在问题:如果cookie中存在 aaaname=aa;name=bb 获取name的值就会出现错误function getCookie(c_name){ if (document.c ...

  4. Android 动态控制OptionMenu的显示与隐藏

    在有些场景下,可能需要动态的显示和隐藏optionmenu,可以这样实现:如果在activity中默认实现了方法: onCreateOptionsMenu(Menu menu) 那么该OptionMe ...

  5. 写入MySQL中文乱码问题

    相信使用数据库进行存储的大家都遇到过中文乱码问题,如何彻底解决?我百度了很多资料与博客,想把自己的经历总结起来给大家参考一下,接下来我先罗列一下大部分修改乱码问题的方法: 1.   修改MySQL数据 ...

  6. vue单文件组件形成父子(子父)组件之间通信(vue父组件传递数据给子组件,子组件传递数据给父组件)

    看了很多文章,官网文档也有看,对父子组件通信说的不是很明白:决定自己总结一下: vue一般都使用构建工具构建项目:这样每个组件都是单文件组件:而网上很多文章都是script标签方式映入vue,组件通信 ...

  7. 为Anaconda python3安装gi模块

    项目开发中需要使用到gi模块,Ubuntu自带的Python3.5可以正常使用gi.项目解释环境是Anaconda python3.5,提示ImportError: No module named ' ...

  8. 电机三环pid控制及调试经验

    一.伺服电机的双环pid 双环pid在正常底盘运动的控制中已经足够了,但是对于双轴云台的控制来说,双环pid的云台控制的响应速度是远远不够的,所以加入了电流环的控制. 两篇大佬的文章--这是我学习pi ...

  9. Java学习——数组的基础知识

    数组的特点.分类:一维.二维数组的使用:数组的声明和初始化.调用数组的指定位置的元素.获取数组的长度.遍历数组.数组元素的默认初始化值

  10. ORM中聚合函数、分组查询、Django开启事务、ORM中常用字段及参数、数据库查询优化

    聚合函数 名称 作用 Max() 最大值 Min() 最小值 Sum() 求和 Count() 计数 Avg() 平均值 关键字: aggregate 聚合查询通常都是配合分组一起使用的 关于数据库的 ...