首页 > 常见问题 > 正文

vue怎么和后端交互

anonymity
发布: 2020-09-10 15:12:39
原创
30608 人浏览过

vue和后端交互的方法:1、使用【$http.get()】方法实现交互;2、使用【$http.post()】方法实现交互;3、使用【$http.jsonp()】方法实现交互。

vue怎么和后端交互

 Vue.js(读音 /vjuː/, 类似于 view)是一个构建数据驱动的 web 界面的渐进式框架。Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。它不仅易于上手,还便于与第三方库或既有项目整合。

怎么实现vue.js的前后端交互呢?

1. 使用$http.get()方法

获取一个普通的文本数据

this.$http.get('a.txt').then(function(res){
    alert(res.data);
},function(res){
    alert(res.status);
});
登录后复制

向服务器发送数据(此时需要为get方法传递第二个参数 {a:1, b:2} , 即所要发送的数据)

this.$http.get('a.php', {
    a: 1,
    b: 2
}).then(function(res) {
    alert(res.data);
}, function(res) {
    alert(res.status);
});
登录后复制

2. 使用$http.post()方法

此时需要为post方法传递第三个参数 {emulateJSON: true}

this.$http.post('a.php', {
    a: 1,
    b: 2
}, {
    emulateJSON: true
}).then(function(res) {
    alert(res.data);
}, function(res) {
    alert(res.status);
});
登录后复制

3. 使用$http.jsonp()方法

访问360搜索接口

this.$http.jsonp('https://sug.so.360.cn/suggest', {
    params: {
        word: 'a'
    }
}).then(function(res) {
    alert(res.data.s);
}, function(res) {
    alert(res.status);
});
登录后复制

访问baidu搜索接口

this.$http.jsonp('https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su', {
    params: {
        wd: 'a'
    },
    jsonp: 'cb'
}).then(function(res) {
    alert(res.data.s);
}, function(res) {
    alert(res.status);
});
登录后复制

以上是vue怎么和后端交互的详细内容。更多信息请关注PHP中文网其他相关文章!

相关标签:
来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
作者最新文章
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责声明 Sitemap
PHP中文网:公益在线PHP培训,帮助PHP学习者快速成长!