react如何写点击事件

react写点击事件的方法:1、使用bind绑定,代码为【this.clicked.bind(this,”hello world”)】;2、使用箭头函数,代码为【onClick={(event)=>this.clicked(“hello】。

react如何写点击事件

本教程操作环境:windows7系统、react16版,该方法适用于所有品牌电脑。

react写点击事件的方法:

1、bind绑定

第一个参数指向this,第二个参数开始才是事件函数接收到的参数,事件对象event默认是最后一个参数。

...clicked(param,event){    console.log(param) //hello world    console.log(event.target.value) //按钮}render(){    return (                                )}...

登录后复制

这里的话绑定this可以统一写,这样代码看起来整洁点。

...constructor(props){    super(props);    this.state = {};    this.checkMenu = this.checkMenu.bind(this);}clicked = (param)=>{    return (event)=>{        console.log(event.target.value); // 按钮        console.log(param); // hello    }}render(){    return (                                )}...

登录后复制

2、箭头函数

箭头函数若要传事件对象event的话,需要在箭头函数中把event作为参数传递给触发的事件。

...clicked(param,event){    console.log(param) //hello world    console.log(event.target.value) //按钮}render(){    return (                                )}...

登录后复制

相关免费学习推荐:JavaScript(视频)

以上就是react如何写点击事件的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2723349.html

(0)
上一篇 2025年3月7日 23:03:26
下一篇 2025年2月23日 09:08:44

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • react组件有过哪些性能优化

    react的组件性能优化有:1、尽量多使用无状态函数构建组件;2、拆分组件为子组件,对组件做更细粒度的控制;3、运用PureRender,对变更做出最少的渲染;4、运用immutable。 react的组件性能优化有: 1. 尽量多使用无状…

    2025年3月7日
    200
  • react中图片怎么引用

    react中引用图片的方法:首先打开代码编辑器;然后使用require方法引入,代码为【】。 react中引用图片的方法: 通常的方法是 登录后复制登录后复制 但是在React中这样会报错 正确的方法应该是 使用require方法 登录后复…

    2025年3月7日
    200
  • react中页面如何传值

    react中页面传值的方法:1、使用【props.params】方法,代码为【】;2、使用query方式使用很简单,类似于表单中的get方法,传递参数为明文。 react中页面传值的方法: 一、props.params 官方例子使用Reac…

    2025年3月7日
    200
  • react组件几种声明方式是什么

    react组件的声明方式:1、函数式定义的无状态组件;2、es5原生方式【React.createClass】定义的组件;3、es6形式的【extends React.Component】定义的组件。 react组件的声明方式: 1、无状态…

    2025年3月7日
    200
  • react中fragment是什么?

    fragment是react中的一个组件,作用是代替div作为外层,可做不可见的包裹元素。定义组件的时,return返回需要唯一根元素,所以经常会写一个div来包裹,但如果不想渲染这个div,减少dom渲染,就可以引用Fragment组件。…

    2025年3月7日
    200
  • react组件添加样式的方法

    react组件添加样式的方法:1、通过表达式传入样式对象的方式来实现;2、通过使用行内样式;3、通过第三方包定义类名;4、通过样式组件“styled-components”添加样式。 本教程操作环境:windows7系统、React16版,…

    2025年3月7日
    200
  • 使用react native的好处是什么?

    使用react native的好处是:使用React Native能够以经济高效的方式构建和维护跨平台的app,可以减少质量保证的费用;而一个跨平台APP,可以同时定位iOS和Android受众市场,可有更广泛的受众群体,具有更大的影响力。…

    2025年3月7日
    200
  • redux如何关联react?

    在react中可以react-redux库来关联redux;react-redux提供了一些封装,可以以一种更科学的代码组织方式,让我们更舒服地在React的代码中使用Redux。 本教程操作环境:windows7系统、React17版,该…

    2025年3月7日
    200
  • 什么编辑器支持react?

    支持react的编辑器:Nuclide、Atom、Sublime Text、Visual Studio Code、WebStorm、Vim编辑器、GNU Emacs编辑器、Spacemacs编辑器、Deco IDE、TextMate编辑器等…

    2025年3月7日 编程技术
    200
  • react子组件怎么向父组件传值?

    react子组件向父组件传值的方法:在父组件中设定state的初始值以及处理该state的函数,同时将函数名通过以props属性值的形式传入子组件,子组件通过调用父组件的函数,进而引起state变化,达到在父组件中展示子组件产生的变化。 本…

    2025年3月7日
    200

发表回复

登录后才能评论