Better input handling with Cleave.JS
As we’ve just seen, getting data from your users in the right shape and form can be a challenge – be it a date in a YYYY/MM format, a phone number with a prefix, or other more structured input types.
We looked at validation previously, but you can further help your users by providing visual clues and feedback as they type to prevent them from reaching the end with validation errors – libraries such as those provided by the popular credit card and online payments processor. Stripe does a great job at helping users enter their credit card info correctly, but for those of us on a budget, we can use Cleave. js for a similar experience.
Figure 8.7: Credit card validation (image from https://nosir.github.io/cleave.js/)
Frustratingly, Vue isn’t supported as a first-class citizen but there’s no reason we can’t set up the directive, which is available at codesandbox.io here – https://bit.ly...
