我想验证一个可选的“股票”价值。我正在使用vuelidate(https://monterail.github.io/vuelidate/)
如果其他值(“价格”)大于0,则“库存”值必须大于0
如果未定义“价格”值,则必须禁用股票价值验证器
价格是输入值(十进制数),股票是滑块(数字)
[编辑]
代码示例
<template>
<form @submit.prevent="submit" class="offer-form">
<q-field label="Prix initial" helper="Indiquer le prix initial de l'offre" :error="hasItemError('price')" :error-label="itemErrorLabel('price')">
<q-input type="number" color="input" @blur="$v.item.price.$touch()" v-model="item.price" />
</q-field>
<q-field label="Stock" helper="Indiquer le nombre de stock" :error="hasItemError('stock')" :error-label="itemErrorLabel('stock')">
<q-slider color="input" label-always label :step=1 :min="0" @blur="$v.item.stock.$touch()" :max="50" v-model="item.stock"/>
</q-field>
<q-btn
icon="fas fa-check"
label="Valider"
color="green"
@click="submit"
/>
</form>
</template>
<script>
import { required, requiredIf, decimal, minValue } from 'vuelidate/lib/validators'
export default {
data () {
return {
item: {
id: null,
title: '',
description: '',
price: null,
reductionPercentage: 15,
stock: 0,
startDate: new Date(),
endDate: null,
product: null,
shop: null,
images: []
},
},
validations: {
item: {
title: { required },
startDate: { required },
endDate: { required },
price: { decimal },
reductionPercentage: {
requiredIf: requiredIf((vueInstance) => {
return vueInstance.price > 0
}),
minValue: minValue(15)
},
stock: {
requiredIf: requiredIf((vueInstance) => {
return vueInstance.price > 0
}),
// minValue ???
}
}
},
methods: {
submit () {
this.onSubmit = true
if (this.isValidate()) {
// Validation ok
}
this.onSubmit = false
},
isValidate () {
this.$v.item.$touch()
if (this.$v.item.$error) {
this.$q.notify({message: 'Vérifiez les champs en erreur', position: 'center'})
return false
}
return true
}
}
}
我对此进行了测试,但不可行=>
minValue: minValue((vueInstance) => {
return vueInstance.price > 0 ? vueInstance.stock > 0 : true
})
我该怎么做?
谢谢
答案 0 :(得分:0)
您没有提供很多代码,所以很难理解您的目标,但是我会尽力,请告诉我是否正是您想要的:)
股票验证者是复选框或函数还是?
var app = new Vue({
el: '#app',
data: {
price: 0,
stock: 0,
},
computed: {
stockvalidator: function()
{
if(this.price > 0 && this.stock > 0) return true
else if(this.price > 0 && this.stock <= 0) return false
else return false
}
}
})
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<div id="app">
<input type="number" v-model="price">
Price: {{price}}
<input type="number" v-model="stock">
Stock: {{stock}}
<br>
<input :disabled="!stockvalidator" type="checkbox"> Stock Validator is {{stockvalidator}}
</div>
答案 1 :(得分:0)
不知道您是否还在为此苦苦挣扎,还是有人遇到同样的问题,但这是我的两分钱。
class FunAllowedinput
{
public string FunctionName{get;set;}
}
public JsonResult FunAllowed(FunAllowedInput input)
{
var records = db.Functions.Where(x => x.FunctionName == input.FunctionName).ToList();
string result = "False";
if (records.Count > 0)
result = "True";
return Json(records, JsonRequestBehavior.AllowGet);
}
干杯!
答案 2 :(得分:0)
我认为你可以这样做:
stock: {
requiredIf: requiredIf(() => {
return this.price > 0 || this.price
}),
minvalue: helpers.withMessage(
"The minimum value for the stock is 0",
helpers.withAsync(async value => {
let retvalue;
if(this.price > 0 && value > 0){
retvalue = true;
}
else if (this.price > 0 && value <= 0){
retvalue = false;
}
else{
retvalue = true;
}
return retvalue;
})
)
}
记住从 vuelidate 导入“helpers”。
我建议您使用自定义验证器制作自己的文件,然后您可以在项目的每个地方使用它。类似于 utils/customValidators.js。