Vue中如何书写js来渲染页面填充数据的部分代码

Posted 2021-03-14 小猪_佩奇

new Vue({
    el:"#app" ,
    data:{
        user:{
            id:"",
            username:"",
            password:"",
            age:"",
            sex:"",
        },
        userList:[]
    },
    methods:{
        findAll:function () {
            //在当前方法中定义一个变量，表明是vue对象
            var _this= this;
            axios.get(‘/day01_eesy_vuejsdemo/user/findAll.do‘)
                .then(function (response) {
                    // handle success
                    _this.userList=response.data;
                    console.log(response);
                })
                .catch(function (error) {
                    // handle error
                    console.log(error);
                })
                .finally(function () {
                    // always executed
                });
        },
        findById:function (userid) {
            //在当前方法中定义一个变量，表明是vue对象
            var _this= this;
            axios.get(‘/day01_eesy_vuejsdemo/user/findById.do‘,{params:{id:userid}})
                .then(function (response) {
                    // handle success
                    _this.user=response.data;
                    $("#myModal").modal("show");
                    console.log(response);
                })
                .catch(function (error) {
                    // handle error
                    console.log(error);
                })
                .finally(function () {
                    // always executed
                });
        },
        update:function (user) {  //post请求
            //在当前方法中定义一个变量，表明是vue对象
            var _this= this;
            axios.post(‘/day01_eesy_vuejsdemo/user/updateUser.do‘, _this.user)
                .then(function (response) {
                    _this.findAll();
                    console.log(response);
                })
                .catch(function (error) {
                    console.log(error);
                });
        }
    },
    created:function(){
        this.findAll();
    }
});