vue ajax请求
安装 npm install vue-resource --save
引入【main.js】
// 引入vue-resource
import VueResource from 'vue-resource'
// 使用vue-resource
Vue.use(VueResource)
mounted() { // 发ajax请求,用以获取数据,此处地址意思是查询 github中 vue 星数最高的项目 const url = 'https://api.github.com/search/repositories?q=vue&sort=stars'; this.$http.get(url).then( response => { const result = response.data.items[0]; console.log(result) this.repositoryUrl = result.html_url; this.repositoryName = result.name; }, response => { alert('请求失败'); }, ); }
data: {
name:'xu',
result:'',
apiUrl: 'http://127.0.0.1:8889/POST/submitInfo'
},
methods: {
submitInfo: function () {
var vm = this;
var data = {};
var name = vm.name;
data.name = name;
data = JSON.stringify(data);
vm.$http.post(vm.apiUrl, data)
.then((response) => {
vm.result = response.body;
});
}
}
分别是get post
Login() { if(!this.loginruleForm.loginname || !this.loginruleForm.loginpass){ this.$message.error('账号或密码不能为空!'); } else { const url = '/user/login?username='+this.loginruleForm.loginname+'&password='+this.loginruleForm.loginpass; // console.log(url); this.$http.post(url) .then(response => { console.log(response.body.error) // if () if (!response.body.error) { this.$message({ message: '登录成功!', type: 'success' }); this.$router.push({ path: '/Dashboard' }) } else { this.$message.error('账号或密码错误,请重新输入!'); } }, response => { alert('请求失败'); }, ); } }