Javascript 更新Vue.js数据

您好，我在更新vue.js的日期时遇到了一些问题，因为我无法使用函数来更新它，这是“破坏浏览器进程”

这是密码

var app = "";
app = new Vue({
    methods: {
        selfClick: function (valor) {
            $("#" + valor).click();
        },
        UpdateData: function () {
            var that = this;
            $.ajax({
                url: "/api/json/cte",
                type: "POST",
                dataType: "json",
                data: {
                    Tomador: var_grid_tomador,
                    Pagina: var_grid_pagina,
                    TotalShow: var_grid_toalshow,
                    OrdenarPor: var_grid_ordernarpor,
                    OrdernarAscDes: var_grid_AscDes,
                    Empresa: var_gird_empresa,
                },
                success: function (rt) {
                    console.log(rt);
                    that.items = rt.Data;
                    $(".loading").hide();
                    $("#maxShow").val(rt.MaxShow);
                    $("#GridTTRows").html("Total de itens: " + rt.TotalItens);
                    footernizer(rt.AllPages, rt.CurrentPage);
                    console.log(rt);
                    $("tobdy .odd").hide();

                },
                error: function (rt) {
                    toastShow("toast-error", "Houve um erro, verifique sua conexão");
                    console.log(rt.responsetext);
                    $(".loading").hide();
                },
            })
            this.$forceUpdate();
        }
    },
    filters: {
        formatDate: function (value) {
            if (!value) return ''
            var data = value.split("T");
            data = data[0].split("-");
            return data[2] + "/" + data[1] + "/" + data[0];
        },
        formatDateTime: function (value) {
            if (!value) return ''
            var data = value.split("T");
            var date = data[0].split("-");
            var times = data[1].split(":");
            return date[2] + "/" + date[1] + "/" + date[0] + " " + times[0] + ":" + times[1];
        },
        brl: function (value) {
            if (!value) return ''
            var numero = value.toFixed(2).split('.');
            numero[0] = "" + numero[0].split(/(?=(?:...)*$)/).join('.');
            return numero.join(',');
        }
    },

    el: '#app',
    created: function () {
        this.UpdateData();

    },

    computed: {
        // Propriedade customizada utilizada como filtro dinâmico
        filteredData: function () {
            var articles_array = this.items,
                searchString = this.searchString;

            if (!searchString) {
                return articles_array;
            }

            searchString = searchString.trim().toLowerCase();

            articles_array = articles_array.filter(function (item) {
                if (item.destinatario.toLowerCase().indexOf(searchString) !== -1) {
                    return item;
                }
            })

            // Return an array with the filtered data.
            return articles_array;
        }
    }
});

但是当我调用这个函数时

app.UpdateData();

浏览器已备货，无法工作

我这样做对吗？

---

如何更新从服务器站点获取的这些数据看来您至少需要将该方法放在beforeMount（）钩子中

此外，为组件定义数据模型也是一种很好的做法

// methods: {...},
data(){
    return {
        items: null
    }
},
// mounted: {...}

---

在ajax方法的

success:

部分中，将.items更改为

this.items

，其中（正如@mannok所说）项在vue实例数据属性中定义。另外，

这个。$forceUpdate（）

可能是不必要的。当数据更改时（只要您没有向现有对象或数组添加属性），Vue将自动更新。

如果您一直使用jquery，那么使用Vue有什么意义？