Validated Form (form-quasar-vuelidate)

Simple example of a Quasar form with Vuelidate plugin.

Technologies

• Quasar Framework
• Vuelidate Plugin

How to run this project

Install NPM dependencies

npm install

Run the app

quasar dev

Access the URL

http://localhost:8080

Exploring the interface

First page containing the empty fields.

Detecting an invalid e-mail address.

Validating the password's minimum length.

All the form's conditions are valid.

Showing the form data in the next page.

Explaining the code

Importing Vue and the Vuelidate plugin to register it.

Importing the Vuelidate features to validate the form fields.

Detecting if any condition from the email input is invalid.

Detecting if any condition from the password input is invalid.

If the form presents any invalid condition, the button will be disabled.