我知道在vanilla JavaScript中,我们可以做到:

onclick="f1();f2()"

在ReactJS中进行两次函数调用的类似功能是什么?

我知道调用一个函数是这样的:

onClick={f1}

推荐答案

用另一个函数/方法包装两个以上的函数调用.以下是该 idea 的几个变体:

1) Separate method

var Test = React.createClass({
   onClick: function(event){
      func1();
      func2();
   },
   render: function(){
      return (
         <a href="#" onClick={this.onClick}>Test Link</a>
      );
   }
});

或ES6课程:

class Test extends React.Component {
   onClick(event) {
      func1();
      func2();
   }
   render() {
      return (
         <a href="#" onClick={this.onClick}>Test Link</a>
      );
   }
}

2) Inline

<a href="#" onClick={function(event){ func1(); func2()}}>Test Link</a>

或ES6同等标准:

<a href="#" onClick={() => { func1(); func2();}}>Test Link</a>

Reactjs相关问答推荐

Reactjs中的chartjs和reaction-chartjs-2的问题

在url中使用MongoDB对象ID被认为是不好的做法?

Reaction上下文值无法传递给其他组件

MUI 日期 Select 器 - 最小日期混乱

React 在第一次渲染时为 null

无法在 NextJS 中获取嵌套对象

在 golang 服务器中刷新或直接 url 路径时响应 404

REACT: UseState 没有更新变量(ant design 模态形式)

如何在 React 中停止嵌套 Link 和 Button 组件的事件传播?

解决在React测试库中的act()警告

部署到github pages时请求路径错误

如何在同一路由路径上重新渲染组件(链接,V6)reactjs

@react-three/postprocessing 没有匹配的从 three.module.js 导出以导入WebGLMultisampleRenderTarget

需要在窗口调整大小时更新 React 组件

刷新页面时状态改变问题

React Router v6 - 访问嵌套路由和处理手写 url 的正确方法

在 Reactjs 中状态发生变化时渲染一个新组件而不替换旧组件

NextJs - 如何从站点 map 生成器中删除重复的 URL?

RTK 查询 POST 方法不会改变数据

如何在 NavBar 中设置动态标题