javascript-将函数作为参数传递,这将是onClick事件

2019-11-08 11:33:14 阅读：245 来源： 互联网

我有一个返回React.ReactElement对象的函数.我想将该函数传递给分配给onClick按钮事件的函数.

我调用该函数：

this._createInjurySection1Drawer([{innerDrawer: this._createInjurySection2Drawer, shouldShow:this._OnClickCloseInjurySection2}])

功能：

private _createInjurySection1Drawer(innerDrawers: any[]): React.ReactNode {

    ...

    let innerDrawer;
    let shouldShow;

    console.log("_createInjurySection1Drawer | innerDrawers: ", innerDrawers);

    if (innerDrawers && innerDrawers.length > 0) {
        innerDrawer = innerDrawers[0].innerDrawer;
        shouldShow = innerDrawers[0].shouldShow;
        innerDrawers.shift();
    }

    return (
        <Drawer
            ...
        >
            <div>
                {sectionOneForm.CreateSection(inputFieldsInjurySection1)}

                {innerDrawer && 
                    innerDrawer(innerDrawers)
                }
                <br/> <br/>
                <div>
                    <Button onClick={shouldShow()} type="primary">Next</Button>
                </div>
            </div>
        </Drawer>
    );
}

运行此命令时,将创建一个无限循环.

单击按钮时如何传递函数来处理？

解决方法:

尝试

<Button onClick={shouldShow} type="primary">Next</Button>

为了进一步说明,

<Button onClick={shouldShow()} type="primary">Next</Button>

实际上会调用shouldShow函数,因此返回值将用作onClick处理程序.如果shouldShow本身返回一个函数,这很好,但是如果它返回例如,则不能很好地工作字符串-“ hello world”()是什么意思？

<Button onClick={shouldShow} type="primary">Next</Button>

而是将函数本身设置为onClick处理程序-“单击时,调用此函数,但要等到那时.”

标签：typescript,reactjs,javascript
来源： https://codeday.me/bug/20191108/2007902.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

javascript-将函数作为参数传递,这将是onClick事件