vue后端获取json正确,console出来的数据也是正确的,页面渲染不正确

新手上路,请多包涵

模态框绑定了v-model,user数据未更新
image.png
image.png

`var vue = new Vue({

            el: '#userList', //作用的div
            data: { //数据绑定  model
                user: {}
            },
            mounted: function() {
                showpage(this, 1);
            },
            methods: {
                edit: function(uid) {
                    console.log(uid)
                    $.ajax({
                        type: 'GET',
                        url: "http://localhost:8080/Inhouse/admin/selectUserOne?uid=" + uid,
                        dataType: "json",
                        success: function(rtn) {
                            this.user = rtn.user;
                        },
                        error: function() {
                            alert("发送失败");
                        }

                    });
                },`
阅读 2.5k
4 个回答
this.user = rtn.user;

中的this有问题。
这里的this指的是ajax作用域内的上下文window对象,而不是vue对象。

解决办法是在

console.log(uid)

后设定var _this = this
然后在$.ajax中使用_this

_this.user = rtn.user;

this作用域

this啊,改成箭头函数

edit: function(uid) {
    const _this = this
    console.log(uid)
    $.ajax({
        type: 'GET',
        url: "http://localhost:8080/Inhouse/admin/selectUserOne?uid=" + uid,
        dataType: "json",
        success: function(rtn) {
            _this.user = rtn.user;
        },
        error: function() {
            alert("发送失败");
        }

    });
},
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题
宣传栏