We’ve released an 1.7.0 update to React Studio. This update includes lot’s of performance fixes for Studio’s engine, form validation and big update to Firebase plugin package.
Studio’s update should come up automatically when you open the app. If you haven’t already downloaded the React Studio you can do it here for free: www.reactstudio.com
You’ll find a brand new validator element in Elements panel. Validator element itself is “just” a text field where you can type what ever message you want. The really interesting part is hidden in the inspector panel in validator element’s settings. The screen shot below is self explanatory.
The simplest way to use validator element is to check “validate” and “required” for all input fields. This means that every field is mandatory and interaction will be cancelled if any of the fields is empty. This works in most of the cases but you can also extend the validation functionality with a custom script.
In this example the script checks if field named “fieldName” has value “John Doe” in it. If the name does not match then validation fails and interaction is cancelled.
How to trigger validation?
To validate the form inputs simply select “In element” interaction and “Perform action” and select “Validate” from the dropdown list. This will trigger the validate element and will stop the interaction chain in case the validation fails. Validation fail will also set the Validator element visible so that user sees that there is something missing/wrong in the form fields.
Finally you should hide the Validator element by default to make it visible only when validation fails.
Firebase plugin update
We’ve also released major update to Firebase plugins. New plugin version supports Cloud Firestore Collection group queries, Increment interaction and much more.
PWA Launch images and “portrait / landscape” orientation settings
You’ll find these settings in App settings panel
Download React Studio from www.reactstudio.com
P.S. We have couple new videos on our Youtube channel. Check them out below