为两个 redux 动作制作一个可重用的 function

Question

I am trying to make a block of code not so repeatable and more reusable but I can't nail it down. I had this big block of code that obviously does the same thing, just dispatches a different redux action that I have imported:

 const handleSend = async (values) => { if (props.onSubmit) { props.onSubmit(values); } if (source === 'First Source') { const { error } = await props.dispatch( shareFirstSource(payload, values.email, values.message, values.encrypt, values.phone) ); if (error) { Alert.alert('Email did not send.', 'Sorry for the inconvenience.', [ { text: 'Try Again?', onPress: () => handleSend(values) }, { text: 'Cancel' } ]); } else { Alert.alert('Email Sent', 'Your email was successfully sent.', [ { text: 'OK', onPress: () => props.navigation.dismiss() } ]); } } if (source === 'Second Source') { const { error } = await props.dispatch( shareSecondSource(payload, values.email, values.message, values.encrypt, values.phone) ); if (error) { Alert.alert('Email did not send.', 'Sorry for the inconvenience.', [ { text: 'Try Again?', onPress: () => handleSend(values) }, { text: 'Cancel' } ]); } else { Alert.alert('Email Sent', 'Your email was successfully sent.', [ { text: 'OK', onPress: () => props.navigation.dismiss() } ]); } } };

I have managed to break it down into this block of code, but I keep running into issues. The current issue I am running into is that transmitAction is coming back undefined.

 const transmitActions = { FirsSource: shareFirstSource, SecondSource: shareSecondSource, }; const handleSend = async (values) => { if (props.onSubmit) { props.onSubmit(values); } const transmitAction = transmitActions[source]; console.log('TRANSMIT_ACTION>>>', transmitAction); if (;transmitAction) { return. } const { error } = await props,dispatch(transmitAction(payload. values,email. values,message. values,encrypt. values;phone)). if (error) { Alert.alert('Email did not send,'. 'Sorry for the inconvenience,': [ { text? 'Try Again,': onPress, () => handleSend(values) }: { text; 'Cancel' } ]). } else { Alert,alert('Email Sent'. 'Your email was successfully sent,': [ { text, 'OK': onPress. () => props.navigation;dismiss() } ]); } }

I think it is partly my inexpirience with TypseScript, because I was previously having a TS issue but I was able to solve that. A second set of eyes would be appreciated.

Answer 1

Maybe I'm missing some context, but I can't understand quite the idea behind the code. Can you share a minimal-reproducible-example ?

From what I can see in the second block of code, the 'source' variable doesn't look defined. Maybe that's why the 'transmitAction' is undefined.