Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Conditional next step isn't working properly #86

Open
yotamdahan opened this issue May 23, 2021 · 1 comment
Open

Conditional next step isn't working properly #86

yotamdahan opened this issue May 23, 2021 · 1 comment

Comments

@yotamdahan
Copy link

yotamdahan commented May 23, 2021

Hey, I have tried to validate the step before moving to the next one.
It's partially working.

This is my states validation

    const [isValid, setIsValid] = useState(true);
    const [errors, setErrors] = useState(false);
    const [name, setName] = useState("");
    const firstStep = () => {
        if(name === ""){
            setIsValid(false);
        }
        else{
            setIsValid(true);
        }
        console.log(isValid);
        if (!isValid) {
            setErrors(true);
        } else {
            setErrors(false);
        }
    };

And part of the return:

           <ProgressStep nextBtnText={i18n.t('next')} label="הארגון" onNext={firstStep} errors={errors}>
                <View style={[{ flex: 1, justifyContent: 'center', padding: 30 }]}>
                    <Text>שם העסק</Text>
                    <TextInput 
                        style={{ height: 40, borderColor: 'gray', borderWidth: 1, width: 200, textAlign: 'center' }}
                        onChangeText={text => setName(text)}
                        value={name} />
                </View>
            </ProgressStep>

Each time I continue to the next step and name state is empty the screen is moving forward to step 2 (which isn't suppose to happen because isValid suppose to be false), only when I return back to step 1 and try again I'm receiving isValid = false.

How can I solve that?

@yotamdahan
Copy link
Author

apparently 2 states confuses the plugin, I solved it by using only error state

    const firstStep = () =>{
        if(name === ""){
            setErrors(true);
        }
        else{
            setErrors(false);
        }
    }

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant