VUE初级教程

文章目录

1. 1. axios介绍
   1. 1.1. vue的初始化过程
2. 2. 之前赋值不到vue的data里

使用Vue.js和Axios从第三方API获取请求数据

axios之Vue请求初始化数据放在Created还是Mounted？

axios介绍

基于Promise的HTTP客户端，用于浏览器和node.js axios-github

• 制作的XMLHttpRequest从浏览器
• 让HTTP从node.js的请求
• 支持Promise API
• 拦截请求和响应
• 转换请求和响应数据
• 取消请求
• JSON数据的自动转换
• 客户端支持以防止XSRF

vue的初始化过程

var app = new Vue({        el: "#app",        data: {            num: 0        },        beforeCreate() {                console.log("创建前")        },        created() {            console.log("创建")        },        beforeMount() {            console.log("计数前")        },        mounted() {            console.log("计数了")        },    })

之前赋值不到vue的data里

最开始放在 created(),mounted()都可以赋值过去

var mydata="" ;var app = new Vue({        el: "#app",        data: {            num: 0,            tableDataA:mydata        },        beforeCreate() {                console.log("创建前")        },        created() {            console.log("创建")        },        beforeMount() {            console.log("计数前")        },        mounted() {            console.log("计数了")        },    })
axios.get('http://localhost:8081/BackSpace/test')    .then(function (response) {    // mydata=response.data 刚开始使用的这个 但是一直赋值不过去        //这个方法也不行,this不能指代当前这个app对象    this.tableDataA=response.data})    .catch(function (error) {    console.log(error);});

成功的版本

axios.get('http://localhost:8081/BackSpace/test').then(response => {this.tableDataA=response.data}).catch(function (error) {console.log(error);});