How to call a function inside the const click function using React Redux?

Question

I'm new with react and redux framework and I need help on how to invoke or call another function from within. As you can see my code below from ToggleSwitch.jsx file. I have a click function and I want to call a toaster function which displays a toast alert but it's not being invoked so I check on the console and it has an error log something like " Reference Error: toaster is not defined ". What did I miss here? Please guide me on how to resolve this type of scenario. Thanks.

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) 

}

Answer 1

The onCheckboxReturningLaterClick function is not in this of the ToggleSwitch component. The syntax you have used for the component:

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

Is a stateless type of component.

Try to remove the this keyword when you're invoking onCheckboxReturningLaterClick in the onClick handler.

Another problem could be that... toastr is really not defined anywhere in the scope :)