If you are looking for an easy module for showing Laravel validation errors, this package is for you. 😜
*Prerequisites: vue >= 2.0.0 and vee-validate >= 2.1.0
1: Install the package 💻 on NPM
npm i @pmochine/vee-validate-laravelimport Vue from 'vue';
import VeeValidate from 'vee-validate';
import VeeValidateLaravel from '@pmochine/vee-validate-laravel';
Vue.use(VeeValidate);
Vue.use(VeeValidateLaravel);Somewhere in Laravel:
$request->validate([
'name' => 'required|min:3|max:255'
]);Somewhere in Vue:
<template>
<div class="form-group" v-bind:class="{'has-error' : errors.has('name')}">
<label for="name">Name</label>
<input
type="text"
name="name"
class="form-control"
v-model="name"
v-validate="'required'" />
<div v-show="errors.has('name')" class="help-block">{{ errors.first('name') }}</div>
</div>
</template>
<script>
export default {
methods: {
doValidation() {
const data = {
name: this.name
};
axios.post('/example', data)
.then(res => {})
.catch(err => {
//adds errors to vee-validate errorBag and returns the errors as object
const errors = this.$addLaravelErrors(err.response);
if(errors){
alert(errors[Object.keys(errors)[0]]);
}
});
}
}
}
</script>If you discover any security related issues, please don't email me. I'm afraid 😱. avidofood@protonmail.com
Now comes the best part! 😍
Oh come on. You read everything?? If you liked it so far, hit the ⭐️ button to give me a 🤩 face.