博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
react事件处理及动态样式添加
阅读量:4480 次
发布时间:2019-06-08

本文共 1088 字,大约阅读时间需要 3 分钟。

多数据的事件绑定,循环数据来进行绑定。如下方式就是循环绑定事件的基本代码:

this.state.lists.map(function(value,index,array){
//代码片段 }.bind(this))
 
这里是一块事件绑定的例子,可以点击按钮,点击的那个按钮来实现选中的状态,并且可获取点击按钮的值:
var Ask = React.createClass({	getInitialState: function() {		return {			lists:[						//初始化button里面的值,即钱的值				{data:8},				{data:28},				{data:88}			],			addClass: false				//用于添加class		}	},	    handleItemClick:function(item,addClass){    	var that = this;        // 点击按钮改变样式        that.setState({        	addClass: item        });    },		render: function() {		return (			
{ // 选择金额按钮模块 this.state.lists.map(function(value,index,array){ return
}.bind(this)) }
); }});// 悬赏金额按钮循环模块var Item = React.createClass({ handleClick:function(){ this.props.onClick(this.props.data,this.props.addClass) }, render:function(){ return (
  • {this.props.data}元
  • ) }});

      

     

    转载于:https://www.cnblogs.com/marymei0107/p/5843171.html

    你可能感兴趣的文章
    Windows添加.NET Framework 3.0 NetFx3 失败 - 状态为:0x800f0950
    查看>>
    隐藏显示终端的光标(shell echo,linux c printf)
    查看>>
    SQL Server 存储过程
    查看>>
    JSP 标准标签库(JSTL)(JSP Standard Tag Library)
    查看>>
    导入项目遇到的问题: Some projects cannot be imported because they already exist in the workspace....
    查看>>
    华为:字符集合
    查看>>
    window10 家庭版 添加Hyper-V虚拟机
    查看>>
    1020. 月饼 (25)
    查看>>
    《小学生四则运算出题软件》个人项目总结
    查看>>
    QFTP走了以后QNetworkAccessManager出现了
    查看>>
    flex 中embed 的用法
    查看>>
    安装vuecli和使用elememtUi
    查看>>
    Windows 8 开发31日-第06日-搜索合约
    查看>>
    数据库SQL SELECT查询的工作原理
    查看>>
    获取屏幕分辨率
    查看>>
    李开复:我对年轻人是分享经验 不是要当导师
    查看>>
    reportng优化
    查看>>
    游戏运营技术之---->运用箱线图分析PCU和DAU(一)
    查看>>
    T2695 桶哥的问题——吃桶
    查看>>
    小功能代码二
    查看>>