Vue.js v-如果不重新渲染

Question

我在 HTML 上定義了以下內容：

<span v-if="valido" class="fas fa-check" style="position: absolute; right: 44px; top: 43px; color: green"></span>
<span v-else class="fas fa-exclamation-circle" style="position: absolute; right: 44px; top: 43px; color: red"></span>

然后我在我的虛擬機中有這個

data: {
    valido: false
}

當輸入更改值時，正在調用此 function

    validarRestricciones: function () {

        var empid = this.inputValue.substring(this.inputValue.indexOf('(') + 1, this.inputValue.length - 1);

        $.ajax({
            type: 'get',
            url: '/api/personas/validar?empid=' + empid,
            contentType: 'application/json; charset=utf-8',
            dataType: "json",
            statusCode: {
                200: function (data) {
                    this.valido = true;
                    return true;
                },
                412: function (data) {
                    this.valido = false;
                    return false;
                },
                500: function (data) {
                    return false;
                }
            }
        });
    }

一切正常，我可以在控制台中看到valido從false更改為true ，但它不會更改或重繪附加到valido屬性的跨度。 似乎只在創建 Vue 組件時完成。 我怎樣才能重繪那個？？？。

Answer 1

你確定它實際上改變了你在數據屬性中設置的“valido”的值嗎？ 在 function 的開頭嘗試將“this”設置為變量，例如“let vm = this”，然后在更改“valido”的內部函數中調用“vm.valido = false”。

可能“this.valido”被分配給狀態代碼 function 立即圍繞它，而不是數據變量中的一組。