注意点:1、事件名称由react提供,所以事件名首字母大写。比如onClick,onMouseOver。

2、为事件提供的处理函数,格式必须是onClick={function},没有小括号。

3、绑定事件的格式写法为:

<button onClick={()=>this.show('传的参数1','传的参数2')}>按钮</button>

show=(arg1,arg2)=>{

console.log('方法传的参数为'+arg1+arg2)

}

import React,{component} from 'react';

class test extends component{
    constructor(){
        super()
        //msg是实例属性
        this.state={
            msg:"哈哈",
        }
    }
    render(){
        return <div>
            <button onClick={()=>this.show('1','2')}>按钮</button>
            <h3>{this.state.msg}</h3>
        </div>
    }
    show=(arg1,arg2)=>{
        // console.log('show方法已经被调用'+arg1+arg2)
        this.setState({
            msg:"重新赋值!必须使用setState这个方法。"
        })
    }

}

react为按钮绑定点击事件和修改属性值的更多相关文章

  1. Android控件——监听按钮的点击事件

    aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAroAAAFTCAIAAABZPDiZAAAgAElEQVR4nOy9918UWfb///1jdu2uBs

  2. JQuery 动态加载 HTML 元素时绑定点击事件无效问题

    问题描述 假设项目中有一个列表页面,如下: 当点击列表一行数据可以显示详情页面,而详情页面的数据是根据当前行的数据作为参数,通过 ajax 请求到后台返回的数据,再根据返回的结果动态生成 html 页 ...

  3. 在Activity中响应ListView内部按钮的点击事件

    最近交流群里面有人问到一个问题:如何在Activity中响应ListView内部按钮的点击事件,不要在Adapter中响应? 对于这个问题,我最初给他的解答是,在Adapter中定义一个回调接口,在A ...

  4. 在Activity中响应ListView内部按钮的点击事件的两种方法!!!

    在Activity中响应ListView内部按钮的点击事件的两种方法 转载:http://www.cnblogs.com/ivan-xu/p/4124967.html 最近交流群里面有人问到一个问题: ...

  5. 在Activity中响应ListView内部按钮的点击事件的两种方法

    转载:http://www.cnblogs.com/ivan-xu/p/4124967.html 最近交流群里面有人问到一个问题:如何在Activity中响应ListView内部按钮的点击事件,不要在 ...

  6. jQuery实现当按下回车键时绑定点击事件

    jQuery实现当按下回车键时绑定点击事件 <script> $(function(){ $(document).keydown(function(event){ if(event.key ...

  7. (转载)js(jquery)的on绑定点击事件执行两次的解决办法

    js(jquery)的on绑定点击事件执行两次的解决办法—不是事件绑定而是事件冒泡 遇到的问题:jquery中用.on()给页面中新加的元素添加点击事件时,点击事件源,绑定的事件执行两次,这里的ale ...

  8. Winform中使用代码编写Button按钮的点击事件

    场景 一般在进行Winform窗体开发时都会拖拽一个Button,然后双击进入Button按钮的点击事件中,进行 点击事件的编写. 如果窗体上事先没有Button按钮,是在代码中生成的Button按钮 ...

  9. DevExpress的图形按钮菜单栏控件WindowsUIButtonPanel的布局、使用和设置按钮的点击事件

    场景 Winform控件-DevExpress18下载安装注册以及在VS中使用: https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/1 ...

随机推荐

  1. 用return关键字实现求和操作

    package com.Summer_0419.cn; /** * @author Summer * 用return关键字的知识,实现求和操作 */ public class Test_Method0 ...

  2. Python 学习 第十二篇:pandas

    pandas是基于NumPy构建的模块,含有使数据分析更快更简单的操作工具和数据结构,最常用的数据结构是:序列Series和数据框DataFrame,Series类似于numpy中的一维数组,类似于关 ...

  3. JqGrid分页按钮图标不显示的bug

    开发中遇到的一个小问题,记录一下,如果有朋友也遇到了相同的问题,可以少走些弯路少花点时间. 如图: 分页插件使用了JqGrid,但是分页栏里出现了问题,上一页.下一页这些按钮的图标都显示为空,记得以前 ...

  4. [WPF]如何使用代码创建DataTemplate(或者ControlTemplate)

    1. 前言 上一篇文章([UWP]如何使用代码创建DataTemplate(或者ControlTemplate))介绍了在UWP上的情况,这篇文章再稍微介绍在WPF上如何实现. 2. 使用Framew ...

  5. sql存储过程中使用 output、nvarchar(max)

    1.sql存储过程中使用 output CREATE PROCEDURE [dbo].[P_Max] @a int, -- 输入 @b int, -- 输入 @Returnc int output - ...

  6. elasticSearch聚合sum查询

    有时需要统计一段时间内,订单的总金额.类似于sql的sum,针对某一字段求和.这就涉及到es的聚合查询,来看看用spring-data-elasticSearch怎么写:   QueryBuilder ...

  7. 斐波那契数列yield表示

    def fib(num): n=0 a,b=0,1 while n<num: print(b) yield a,b=b,a+b n=n+1a=fib(30)next(a)next(a)  

  8. python os模块详解

    一.Python os模块(Linux环境) 1.1 执行shell命令 os.system('cmd') 执行命令不保存结果 os.popen('command') 执行后返回结果,使用.read( ...

  9. 在网站开发时,可以设置防盗,不被复制和F12

    禁止小功能 //禁止右键 document.oncontextmenu = function () { return false } //禁止f12 document.onkeydown = func ...

  10. jQuery实现Ajax请求时,页面显示等待的效果,超过指定请求时间后,进行其他操作

    背景:有一个按钮,点击之后向后端程序发起Ajax请求,在请求结果没有返回之前,页面显示等待的效果,此时仍旧是异步请求,等待的效果在接收到结果后撤销. 需求:因为网络延迟或者后端程序的问题,在发起Aja ...