3.2事件对象

可以通过事件处理程序的参数

React中的事件对象叫做:合成事件(对象)

合成事件:兼容所有浏览器

//导入react
    import React from 'react'
     
    import ReactDOM from 'react-dom'
    //导入组件
    import Hello from './Hello'
    // 约定1:类组件必须以大写字母开头
     
    // 约定2:类组件应该继承react.component父类 从中可以使用父类的方法和属性
     
    // 约定3:组件必须提供render方法
     
    // 约定4:render方法必须有返回值
     
    class HelloWorld extends React.Component {
        handleClickPage=(e)=>{
            e.preventDefault()
        }
        handleClick(){
            console.log("geyao")
        }
        render() {
            return (
                <div>
                    <Hello></Hello>
                    <button onClick={this.handleClick}>点我</button>
                    <a onClick={this.handleClickPage}>geyao</a>
                </div>
            )
        }
    }
     
    ReactDOM.render(<HelloWorld />, document.getElementById('root'))

好客租房25-react中的事件处理(事件对象)的更多相关文章

  1. React中的事件处理为什么要bind this?

    个人总结: 问: 请给我讲一下React中的事件处理为什么要bind this? 答: 好的,比如说我写了一个类组件,有个onClick属性 ,onClick={ this.fun },如果不bind ...

  2. React中的合成事件

    React中的合成事件 React自己实现了一套高效的事件注册.存储.分发和重用逻辑,在DOM事件体系基础上做了很大改进,减少了内存消耗,简化了事件逻辑,并最大程度地解决了IE等浏览器的不兼容问题. ...

  3. react第五单元(事件系统-原生事件-react中的合成事件-详解事件的冒泡和捕获机制)

    第五单元(事件系统-原生事件-react中的合成事件-详解事件的冒泡和捕获机制) 课程目标 深入理解和掌握事件的冒泡及捕获机制 理解react中的合成事件的本质 在react组件中合理的使用原生事件 ...

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

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

  5. react 中的绑定事件

    handleOpen = (e)=> { this.setState({ open: true }) } <Button color='primary' onClick={this.han ...

  6. react事件中的事件对象和常见事件

    不管是在原生的js还是vue中,所有的事件都有其事件对象,该事件对象event中包含着所有与事件相关的信息,在react中,所有的事件也有其事件对象,在触发DOM上的某个事件时,就会产生一个事件对象. ...

  7. JavaScript 中的window.event代表的是事件的状态,jquery事件对象属性,jquery中如何使用event.target

    http://wenda.haosou.com/q/1373868839069215 http://kylines.iteye.com/blog/1660236 http://www.cnblogs. ...

  8. JavaScript中冒泡与事件委托

    冒泡 事件触发后事件流的三个阶段按顺序依次是: 1.捕获阶段 2.目标阶段 3.冒泡阶段 大盒子包裹小盒子,两个盒子都分别添加点击事件,当点击小盒子,两个盒子的事件都会触发. 事件委托 下级元素委托上 ...

  9. 从零开始学习jQuery (五) 事件与事件对象

    本系列文章导航 从零开始学习jQuery (五) 事件与事件对象 一.摘要 事件是脚本编程的灵魂. 所以本章内容也是jQuery学习的重点. 本文将对jQuery中的事件处理以及事件对象进行详细的讲解 ...

  10. jQuery入门(3)事件与事件对象

    jQuery入门(1)jQuery中万能的选择器 jQuery入门(2)使用jQuery操作元素的属性与样式 jQuery入门(3)事件与事件对象 jQuery入门(4)jQuery中的Ajax()应 ...

随机推荐

  1. 《自动控制原理》个人笔记(来自ppt课件)

    控制的含义 控制(CONTROL)----某个主体使某个客体按照一定的目的动作.主体–人:人工控制: 机器:自动控制客体–指一件物体,一套装置,一个物化过程,一个特定系统. 人工控制与自动控制 人在控 ...

  2. 纯干货数学推导_傅里叶级数与傅里叶变换_Part4_傅里叶级数的复数形式

  3. 基于mongodb的搜索分页

    mongodb模糊查询并分页 1.建立数据库 代码如下: var mongoose = require('mongoose'); var shortid = require('shortid'); v ...

  4. 实现自定义的小程序底部tabbar

    背景 诶,当然是为了实现更有温度的代码啦(背后设计师拿着刀对着我) 自带tabbar app.json中配置: tabBar: { backgroundColor: '#fff', borderSty ...

  5. JavaScript实现科学计算器

    运行效果: 可实现科学计算器的功能,如:PI,sin,cos,tan等 源代码: 1 <!DOCTYPE html> 2 <html lang="zh"> ...

  6. 硬件vendor id查询对照列表

    Hex-ID Vendor Name003D Lockheed Martin Corp0E11 Compaq1000 Symbios Logic Inc.1001 KOLTER ELECTRONIC1 ...

  7. MySQL 表数据多久刷一次盘?

    前言 事情是这样的,在某乎的邀请回答中看到了这个问题: - 然后当时我没多想就啪一下写下来这样的答案: 这个其实要通过 MySQL 后台线程来刷的,在 Buffer Pool 中被修改的过的 Page ...

  8. 帝国CMS实现栏目批量修改:是否生成

    帝国cms实现栏目批量修改 是否生成:不生成栏目页, 不生成内容页, 不生成JS调用, 标签不调用的修改方本文关键字词:栏目批量设置第一步./e/admin/SetMoreClass.php中查找: ...

  9. mybatis在if标签里判断字符串相等

    https://www.cnblogs.com/westward/p/6910856.html

  10. 解决zabbix5字体中文口口乱码

    环境信息 系统:Ubuntu20.04 zabbix版本:5.4 解决方法一 此方法比较偷懒,就是不改变zabbix相关配置,直接用原名替换字体文件. 原字体字体名称为DejaVuSans.将方法二的 ...