import React from 'react';
import PropTypes from 'prop-types';
class Home extends React.Component{
render(){
return (
<div>
<h1>hello word</h1>
<button onClick={(event)=>this.TestMethod(event,"哈哈哈")}>
click me
</button>
</div>
)
}
//也可以用构造函数来表示this,如果用正常的函数体写的话,this是不能表示出来的,这里的this 指的是home 这个类,因为箭头函数没有作用域
TestMethod=(e,arg1)=> {
console.log('e is :',e);
e.preventDefault();
console.log('链接被点击');
console.log('this is :',this);
console.log(arg1);
}
} Home.ProtoTypes={
sex:PropTypes.number
}
export default Home;

react 中事件参数和一般参数以及this绑定的写法的更多相关文章

  1. react 中刷新,路由传参数丢失不存在了?

    你可能在Link to没写state {{pathname:'/report',state:{storageClear:this.state.storageClear}}}

  2. react中事件的使用

    import React from 'react' class Home extends React.Component{ constructor(props){ super(props) this. ...

  3. react.js 从零开始(五)React 中事件的用法

    事件系统   虚拟事件对象 事件处理器将会传入虚拟事件对象的实例,一个对浏览器本地事件的跨浏览器封装.它有和浏览器本地事件相同的属性和方法,包括 stopPropagation() 和 prevent ...

  4. react中事件冒泡之填坑

    今天在写个组件,大致代码是这样的: class Switch extends React.Component { handlerChange = (e) => { const {onChange ...

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

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

  6. Linux中inotify软件部署及参数事件演示

    声明:博主使用的是CentOS6.9的系统 参考资料: https://github.com/rvoicilas/inotify-tools/wiki http://www.ibm.com/devel ...

  7. jQuery中Ajax事件beforesend及各参数含义1

    jQuery中Ajax事件beforesend及各参数含义 转自:http://blog.sina.com.cn/s/blog_609f9fdd0100wprz.html Ajax会触发很多事件. 有 ...

  8. React 中阻止事件冒泡的问题

    在正式开始前,先来看看 JS 中事件的触发与事件处理器的执行. JS 中事件的监听与处理 事件捕获与冒泡 DOM 事件会先后经历 捕获 与 冒泡 两个阶段.捕获即事件沿着 DOM 树由上往下传递,到达 ...

  9. React中如何优雅的捕捉事件错误

    React中如何优雅的捕捉事件错误 前话 人无完人,所以代码总会出错,出错并不可怕,关键是怎么处理. 我就想问问大家react的错误怎么捕捉呢? 这个时候: 小白:怎么处理? 小白+: ErrorBo ...

随机推荐

  1. JavaScript求两点之间相对于Y轴的顺时针旋转角度

    需求: 已知一个向量,初始位置在y轴方向,如图红色箭头,绕中心点(x1, y1)旋转若干角度后,到达Line(x2,y2 x1,y1)的位置,求旋转角度 分析: 坐标点(x1, y1)(x2, y2) ...

  2. js:获取单选组radio中的被选择的数据

    现在有一name为sex的单选组,代表的是选择性别,要求获取radio中被选择的选项值 <div class="sexDiv"> 用户性别: <input cla ...

  3. linux中cut命令

    cut命令 cut常用参数 cut命令用来显示行中的指定部分,删除文件中指定字段. 说明:该命令有两项功能,其一是用来显示文件的内容,它依次读取由参数file所指明的文件,将它们的内容输出到标准输出上 ...

  4. [Web 前端] 013 css 内外边距

    1. css 内间距 也称:"内补白"或"内补丁" 参数 释义 padding 检索或设置对象四边的内部边距,如 padding:10px; padding:5 ...

  5. MySQL binlog之数据恢复

    一.恢复方案1.数据量不是特别大,可以将mysqldump命令备份的数据使用mysql客户端命令或者source命令完成数据的恢复:2.使用Xtrabackup完成数据库的物理备份恢复,期间需要重启数 ...

  6. 关于java的数组

    一定要写成 int[] arr = new int[30] 这样每个元素默认为0; 介样子的 如果写成 int[] arr = {1,2,3,4}; 那么他的长度就是4

  7. Java代码执行过程概述

    Java代码经历三个阶段:源代码阶段(Source) -> 类加载阶段(ClassLoader) -> 运行时阶段(Runtime) 首先我们来理清一下Java代码整个执行过程, 让我们对 ...

  8. 10、应用机器学习的建议(Advice for Applying Machine Learning)

    10.1 决定下一步做什么 到目前为止,我们已经介绍了许多不同的学习算法,如果你一直跟着这些视频的进度学习,你会发现自己已经不知不觉地成为一个了解许多先进机器学习技术的专家了. 然而,在懂机器学习的人 ...

  9. asp.net中的<% %>,<%= %>,<%# %><%$ %>的使用

    原文:https://www.cnblogs.com/Hackerman/p/3857630.html 首先我们来看一下<% %>的使用 在aspx的页面中只能使用服务器控件和一般的控件, ...

  10. VUE组件嵌套

    vue中组件嵌套烦分为两种,分别是全局注册组件和局部注册组件 基本步骤: 1.在components 下创建一个新的.vue结尾的文件,文件首字母最好是大写,基于规范复制代码 2.分别写出结构层< ...