-
-
Notifications
You must be signed in to change notification settings - Fork 1.2k
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
How to assign and transition conditionally? #850
Comments
Here is what I tried later: Invoking a promise to validate{
states: {
mobileNumber: {
id: 'mobileNumber',
initial: 'invalid',
on: {
SET_MOBILE_NUMBER: {
target: '.validating',
actions: (context, event) => assign({mobileNumber: event.value}),
},
},
states: {
validating: {
invoke: {
src: validateMobileNumber,
onDone: {
target: 'valid',
actions: assign({mobileNumberError: ''}),
},
onError: {
target: 'invalid',
actions: assign({
mobileNumberError: (context, event) => event.data,
}),
},
},
},
invalid: {},
valid: {},
},
},
} |
Invoking service (with Promise) sounds like a good idea. I'm still learning about Maybe we can get some pro hints from @davidkpiano ;) |
...
validating: {
invoke: {
src: 'validateMobileNumber',
onDone: [
{
target: 'valid',
actions: assign({mobileNumberError: ''}),
cond: (_ctx, event) => {
const validationResponse = event.data;
if (validationResponse.result) { // I don't know what's in your response... Just an example
return true;
} else {
return false;
}
}
},
// If the condition is false, validation failed, so go to invalid
{
target: 'invalid',
actions: assign((_ctx, event) => ({ mobileNumberError: event.data.validationMessage }))
}
],
onError: { ... } |
Yep, guarded transitions (linked above by @semopz) are what you want. |
Interesting, I am also facing a similar issue but it involves multiple checks. For instance. how would you validate a text input with multiple guards? min length, max length, invalid characters, maybe a regex as well. I am rewriting a multiform wizard that currently uses Formik and Yup, but ideally would like all logic the machine so it can be tested independently of Formik. |
@jaetask You can probably come up with a solution in userland for this, no? |
Bug or feature request?
Question/Feature Request
Description:
I am in the process of building a multi step form. When a field is filled, I am firing an event. In state config, I assign the field value to context when event is fired. I need to now validate the context and if there are no errors, need to transition to next state. If there are errors, the error message should be put in context. How do I do this? Additionally, the validation might be asynchronous.
(Bug) Expected result:
NA
(Bug) Actual result:
NA
(Bug) Potential fix:
NA
(Feature) Potential implementation:
I am sure there is a way to do this already. You may want to put up a recipe of this in documentation.
Link to reproduction or proof-of-concept:
NA
The text was updated successfully, but these errors were encountered: