Как я могу поместить эту функцию в компонент? - PullRequest
Новая
       8

Как я могу поместить эту функцию в компонент?

0 голосов
/ 04 января 2019

У меня есть собственная исходная кодовая база, в которую я импортирую компонент и дважды использую одну и ту же функцию, но с небольшими отличиями.Я хотел бы передать это как-то на новый компонент.Есть идеи?Это выглядит так: 

handleConfirmApplication = async () => {
    const checkVals =
        get('shiftInvite.account.accountName', this.props) === ONBOARDING_ACCOUNT
            ? omit('payRate', this.props.confirmationCheckValues)
            : this.props.confirmationCheckValues;
    if (Object.values(checkVals).every(val => val)) {
        this.props.onToggleConfirmPopUp();
        this.props.onToggleLoadingApply();
        try {
            await this.handleShiftInviteDecision('ACCEPT')();
        } catch (e) {
            Alert.alert('Error', parseError(e));
        } finally {
            this.props.onToggleLoadingApply();
        }
    } else {
        Alert.alert('Error', 'Please confirm all shift requirements');
    }
};

И второй следующий: 

handleConfirmApplication = async () => {

    const checkVals =
        get('shift.account.accountName', this.props) === ONBOARDING_ACCOUNT
            ? omit('payRate', this.props.confirmationCheckValues)
            : this.props.confirmationCheckValues;
    if (Object.values(checkVals).every(val => val)) {
        this.props.onToggleConfirmPopUp();
        this.props.onToggleLoadingApply();
        try {
            const shiftId = this.props.shift.id;
            const {
                data: { updatedShifts },
            } = await this.props.updateMyApplication(shiftId, 'APPLY');
            this.setState({
                updatedShift: updatedShifts.find(({ id }) => id === shiftId),
            });
        } catch (e) {
            Alert.alert('Error', parseError(e));
        } finally {
            this.props.onToggleLoadingApply();
        }
    } else {
        Alert.alert('Error', 'Please confirm all shift requirements');
    }
};

1 Ответ

0 голосов
/ 04 января 2019

Просто используйте оператор if/else в вашем try/catch и троичное условие для создания вашей строки.Выбор между тем или другим должен быть сделан передачей параметра вашей функции: 

handleConfirmApplication = async (isInvite) => {
    const checkVals =
        get(`shift${isInvite ? 'Invite' : ''}.account.accountName`, this.props) === ONBOARDING_ACCOUNT
            ? omit('payRate', this.props.confirmationCheckValues)
            : this.props.confirmationCheckValues;
    if (Object.values(checkVals).every(val => val)) {
        this.props.onToggleConfirmPopUp();
        this.props.onToggleLoadingApply();
        try {
            if(isInvite){
                await this.handleShiftInviteDecision('ACCEPT')();
            }
            else{
                const shiftId = this.props.shift.id;
                const {
                    data: { updatedShifts },
                } = await this.props.updateMyApplication(shiftId, 'APPLY');
                this.setState({
                    updatedShift: updatedShifts.find(({ id }) => id === shiftId),
                });
            }
        } catch (e) {
            Alert.alert('Error', parseError(e));
        } finally {
            this.props.onToggleLoadingApply();
        }
    } else {
        Alert.alert('Error', 'Please confirm all shift requirements');
    }
};

и вызовом его: 

handleConfirmApplication(true)

Я пропустил какие-либо другие различия между вашими функциями?

Чтобы использовать его в повторно используемом компоненте: 

handleConfirmApplication = async () => {
    const { isInvite } = this.props
    const checkVals =

И вызывать его: 

<MyComponent isInvite={false} /> //Just switch it to true to get the other version
...