Мои требования примерно такие.
- Я должен ввести поля для проверки ввода пользователя.
- Когда пользователь заполняет поля и нажимает кнопку отправки, перед переходом к отправке я хочу отобразить все сообщения об ошибках.
- Отправка должна происходить, если в данных пользователя нет ошибок
Это мой код.
<template>
<div>
<h1>Add Items</h1>
Product Name :
<input
type="text"
name="product"
v-model="product"
v-validate="'required|alpha_dash'"
>
<span style="color:red;">{{errors.first('product')}}</span>
<br>
Product Price :
<input
type="number"
name="price"
v-model="price"
v-validate="'required|min_value:100|max_value:500'"
>
<span style="color:red;">{{errors.first('product')}}</span>
<br>
<button @click="submit">Save</button>
</div>
</template>
<script>
export default {
data() {
return {
price: "",
product: ""
};
},
methods: {
submit() {
alert("On submit");
}
}
};
</script>
Теперь отображается только первая ошибка {{errors.first('product')}}
. Вместо этого я хочу отобразить все ошибки одновременно
и
отображает ошибки только при касании поля ввода. Я хочу отобразить все ошибки проверки независимо от того, касаетесь ли вы полей, я хочу отображать все ошибки, когда вы нажимаете кнопку отправки.