完全被困在这里。我有一个react组件,它将函数requestPatchAccount
传递给子组件:
import React from 'react';
import { Formik, Field, Form } from 'formik';
...
import { requestPatchAccount } from '../../../modules/account/actions';
const EditCustomerForm = ({customer, handleSubmit}) => {
return (
<Container>
<Formik
render={ () => (
<Form>
...
<AccountPaymentDetails
currentUser={customer}
requestPatchAccount={requestPatchAccount}
onSubmit={handleSubmit}
/>
子组件看起来像这样:
const AccountPaymentDetails = ({
currentUser,
requestPatchAccount,
...
}) => {
...
const setCCDetails = ccToken => {
const payload = { ccToken }
console.log(account_jwt);
console.log(payload);
requestPatchAccount(account_jwt, payload);
};
...
两个console.log
语句显示正确的信息。但是,requestPatchAccount
从未被调用。 requestPatchAccount
看起来像这样:
export const requestPatchAccount = (authToken, patches) => (
dispatch,
getState
) => {
console.log('i am here');
console.log(authToken);
console.log(patches);
...
};
没有任何内容从requestPatchAccount
内部登录到控制台。我试过不将其作为道具传递,而是从具有子组件的同一文件中导入,但是我看到了相同的行为。有人可以解释我在做什么错吗?
答案 0 :(得分:3)
您似乎只在调用函数的第一部分,该函数返回具有其他两个参数的另一个函数
requestPatchAccount = (authToken, patches) => (dispatch,getState) => {}
您仅拨打requestPatchAccount(authToken, patches)
当您requestPatchAccount(account_jwt, payload)
您需要致电requestPatchAccount(authToken, patches)(dispatch,getState)
答案 1 :(得分:2)
您的函数requestPatchAccount
的设置方式是在调用它时实际上返回一个函数。 Here可以看到实际效果。如果要将代码保留在设置中,则需要执行以下操作。
requestPatchAccount()()
基本上会采用requestPatchAccount
返回的函数并立即调用它。
当然,您需要根据需要传递每个函数所需的值。