在 vue.js 中使用 vee-validate 验证之前和未来的日期答案

【问题标题】：validate previous and future dates using vee-validate in vue.js在 vue.js 中使用 vee-validate 验证之前和未来的日期
【发布时间】：2021-08-12 01:18:21
【问题描述】：

我正在使用 vee-validate 进行验证

<datetime v-validate="'required'" format="YYYY-MM-DD H:i:s" name="futureDates" width="100px" :class="['form-control', {'is-invalid': errors.has('futureDates')}]" v-model="formfutureDates" ></datetime> 

 <datetime v-validate="'required'" format="YYYY-MM-DD H:i:s" name="prevDates" width="100px" :class="['form-control', {'is-invalid': errors.has('prevDates')}]" v-model="prevDates" ></datetime>

现在尝试在 futureDates 字段中验证未来日期和以前的日期，如果用户输入以前的日期，那么它应该验证并显示错误，如果用户输入未来的日期，那么它应该验证并显示错误消息。

非常感谢任何帮助。

【问题讨论】：

标签： vue.js vuejs2 vue-component

【解决方案1】：

您可能可以观看 prevDates，然后设置他们的道具min 和max。就像下面几行：

<datetime :min="prevDates" v-validate="'required'" format="YYYY-MM-DD H:i:s" name="futureDates" width="100px" :class="['form-control', {'is-invalid': errors.has('futureDates')}]" v-model="formfutureDates" ></datetime> 

 <datetime v-validate="'required'" format="YYYY-MM-DD H:i:s" name="prevDates" width="100px" :class="['form-control', {'is-invalid': errors.has('prevDates')}]" v-model="prevDates" ></datetime>

我只是给出一个想法，我没有使用过这样的组件。

或者再看一遍，您可以将 prevdates 的 max 设置为 formfutureDates

【讨论】：

@Dharman ：感谢您的回答，我试图仅使用 vee-validate 验证日期时间，如下所示：stackoverflow.com/questions/50881323/…，但假设我在字段中输入日期时间时出现问题仍然需要显示日期时间字段。