首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往
您找到你想要的搜索结果了吗?
是的
没有找到

React组件内事件 实现tab切换

组件内默认onClick事件触发函数actionClick, 是不带参数的, 不带参数的写法: 如onClick= { actionItem } 带参数的写法, onClick = { this.activateButton.bind...(this, 0) } 下面是一个向组件内函数传递参数的小例子 需求: 在页面的底部, 有四个按钮, 负责切换内容, 当按钮被点击时, 变为激活状态, 其余按钮恢复到未激活状态 分析: 我们首先要创建点击事件的处理函数..., 当按钮被点击时, 将按钮的id作为参数发送给处理函数, 处理函数激活对应当前id的按钮, 并将其余三个按钮调整到未激活状态 实现: 用组件state创建一个含有四个元素的一维数组, 四个元素默认为零..., 但界面中某个按钮被点击时, 组件内处理函数将一维数组内对应元素变为1, 其它元素变为0 效果演示: ?

1.2K50

【小程序】数据和事件绑定和数据同步

事件处理函数中为 data 中的数据赋值 ​7. 事件 8. bindinput 的语法格式  9. 实现文本框和 data 之间的数据同步 数据绑定 1....举例如下: 点击内部的按钮时,点击事件以冒泡的方式向外扩散,也会触发外层 view 的 tap 事件处理函数。...通过 bindtap,可以为组件绑定 tap 触摸事件,语法如下: 在页面的 .js 文件中定义对应的事件处理函数,事件参数通过形 event(一般简写成 e) 来接 收: 6....事件 小程序中的事件比较特殊,不能在绑定事件的同时为事件处理函数传递参数。...可以为组件提供 data-* 自定义属性,其中 * 代表的是参数的名字,示例代码如下: 最终:  info 会被解析为参数的名字  数值 2 会被解析为参数的值 在事件处理函数中,通过 event.target.dataset

88820
领券