如何使用 React Redux 在 const click 函数中调用函数？答案

【问题标题】：How to call a function inside the const click function using React Redux?如何使用 React Redux 在 const click 函数中调用函数？
【发布时间】：2018-08-17 00:16:16
【问题描述】：

我是 react 和 redux 框架的新手，我需要有关如何从内部调用或调用另一个函数的帮助。正如您可以从 ToggleSwitch.jsx 文件中看到我的代码。我有一个点击功能，我想调用一个烤面包机功能它显示了一个 toast 警报，但它没有被调用，所以我在控制台上检查它有一个错误日志，比如 “参考错误：未定义烤面包机”。我在这里错过了什么？请指导我如何解决这种情况。谢谢。

ToggleSwitch.jsx

const ToggleSwitch = ({ className, input, label, meta: { touched, error }, ...rest }) => (
    <div>
        <Switch input={{ defaultChecked: input.value }}
            className={className}
            onChange={e => input.onChange(e.target.checked)}
            onClick={this.onCheckboxReturningLaterClick()}
            label={label}
            {...rest} />
        <input name={input.name} value={input.value} type="hidden" />
    </div>

)

const onCheckboxReturningLaterClick = () => {

      toastr.error(dude.messages.UNABLE_TO_PROCEED) 

}

【问题讨论】：

你没有传递任何道具，oncheckboxReturningLaterClick 没有任何功能。
我可以看到，没有定义 toastr...

标签： javascript reactjs redux react-redux

【解决方案1】：

onCheckboxReturningLaterClick 函数不在ToggleSwitch 组件的this 中。您用于组件的语法：

const Component = (props) => <h1>props.title</h1>

是一种无状态类型的组件。

当您在 onClick 处理程序中调用 onCheckboxReturningLaterClick 时，尝试删除 this 关键字。

另一个问题可能是...toastr 确实没有在范围内的任何地方定义:)

【讨论】：