Как скрыть сообщение об ошибке в vue js после проверки истинности?

Question

На самом деле мою проблему я проверяю, когда определенное значение является действительным через 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>

Но когда Статус истиненсообщение об ошибке все еще присутствует.Как я могу обновить на основе изменения?

Answer 1

Простой: в checkLimit сделать vm.error=null в случае успеха. Затем в шаблоне сделать <p v-if="error">{{error}}</p>.

Поскольку все данные реактивны, p исчезнет, ​​когда error станет ложным.

РЕДАКТИРОВАТЬ: если вы хотите сохранить p и переключить сообщение, сделайте, как предложено в другом комментарии (нет v-if).

Answer 2

Вы должны установить error на '', когда e.status - это истина.Как это

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