VueJs以前后端数据交互(使用Vue-resource实现)

一、安装vue-resource到项目中，找到当前项目

输入：npm install vue-resource --save

 

二、安装完毕后，在main.js中导入，以下所示：

import  VueResource  from 'vue-resource'

Vue.use(VueResource) 

 

//页面加载以前 使用钩子函数 获取内容
created() {
this.$http.get("http://jsonplaceholder.typicode.com/todos")
.then((data) => {
this.arrs = data.body;
}),
this.$http.get("https://api.apiopen.top/EmailSearch?number=1012002").then((data) => {
this.arr = data.body;
})
}

 

PS:

main.js 加上

Vue.http.options.root = 'http://jsonplaceholder.typicode.com';

 

将页面的created(){}改成:

created() { this.$http.get("todos") .then((data) => { this.arrs = data.body; })