验证为真后如何在vue js中隐藏错误消息？答案

【问题标题】：How to hide error message in vue js after validation is true?验证为真后如何在vue js中隐藏错误消息？
【发布时间】：2019-02-19 21:55:41
【问题描述】：

实际上我的问题是我正在通过 v-on:input 检查特定值何时有效。如果该值无效，我会得到“无效数据”的响应，并且显示相同。但是，当值变为有效时，“无效数据”并没有隐藏。我怎么能这样做。

我的代码是

  methods: {
            checkLimit: function () {
                var vm = this;
                data = {};
                if (this.no != '') data['no'] = this.no;
                $.ajax({
                    url: "doc/checkNumber",
                    method: "POST",
                    data: data,
                    dataType: "JSON",
                    success: function (e) {
                          if (e.status == true) {
                                       }
                           else{
                            console.log(e.msg);
                            vm.error = e.msg;
                            }

                    },
                });
            },
}

所以如果状态为假，我将显示为

<input type="text" class="form-control" v-model="orno" required="" 
v-on:input="checkLimit" maxlength="3"><p>{{error}}</p>

但当 Status 为 true 时，错误消息仍然存在。如何根据更改进行更新？

【问题讨论】：

标签： vue.js vuejs2 vue-component

【解决方案1】：

当e.status 为真时，您应该将error 设置为''。像这样

 success: function (e) {
    if (e.status == true) {
        vm.error = '';
    } else {
       console.log(e.msg);
        vm.error = e.msg;
    }
 },

【讨论】：

【解决方案2】：

简单：在checkLimit 做vm.error=null 成功。然后在模板中做<p v-if="error">{{error}}</p>。

由于在 vue 中所有数据都是响应式的，p 将在 error 为 falsy 时消失。

编辑：如果您想保留 p 并切换消息，请按照其他评论中的建议进行操作（无 v-if）。

【讨论】：