多个功能onClick不起作用reactJs答案

【问题标题】：multiple functions onClick not working reactJs多个功能onClick不起作用reactJs
【发布时间】：2019-10-29 10:05:23
【问题描述】：

我正在尝试在单击时调用两个多个函数。当我尝试这样做时它不起作用。但它在单个函数中起作用。这是两个函数。

   //first function
saveValue = (e) => {
    // console.log('savecategory', e.target.innerHTML);

    this.setState({
        category: e.target.innerHTML
    }, this.makeAxiosRequest);

};

//second function

goToLastPage = () => {
    const {currentPage, pages, end} = this.state;
};

这是我正在尝试处理的 onClick 事件。

<button   onclick={()=>{this.saveValue();this.goToLastPage()}}>Residence</button>

但它不起作用。只有当我像这样将它作为单个函数调用时它才起作用。

<button onClick={this.saveValue}>Residence</button>

<button onClick={this.goToLastPage}>Residence</button>

我怎样才能让它工作？

【问题讨论】：

Call multiple functions onClick ReactJS的可能重复
如果您扩展“它不起作用”会很好，您会收到错误吗？你的函数被调用了吗？
我没有收到任何错误。这个函数不执行我调用了多个函数。

标签： javascript reactjs

【解决方案1】：

saveValue 函数需要事件参数。所以试试这个：

<button onClick={(e) => { this.saveValue(e); this.goToLastPage(); }}>Residence</button>

另外，onclick 应该是 onClick

【讨论】：

【解决方案2】：

这是因为在您的第一个示例中，您输入了 onclick 而不是 onClick。注意C 的大写。 React 事件处理程序是驼峰式的。

【讨论】：

我在我的代码上做了那部分。很抱歉这里出现了不需要的错误。问题出在事件参数上。第一个回复回答了我的问题。谢谢

【解决方案3】：

您需要使用 onClick 而不是 onclick。这是 HTML 和 Reactjs 的区别。

更多详情请点击此链接：https://reactjs.org/docs/handling-events.html

也可以看看这个：Call multiple functions onClick ReactJS

<button onClick={()=>{this.saveValue();this.goToLastPage()}}>Residence</button>

【讨论】：