How vue interacts with the backend

How to interact with vue and the backend: 1. Use the [$http.get()] method to realize interaction; 2. Use the [$http.post()] method to realize interaction; 3. Use [$http .jsonp()] method to achieve interaction.

Vue.js (pronounced /vjuː/, similar to view) is a progressive framework for building data-driven web interfaces. The goal of Vue.js is to enable responsive data binding and composed view components with the simplest possible API. Not only is it easy to get started, it is also easy to integrate with third-party libraries or existing projects.

How to realize the front-end and back-end interaction of vue.js?

1. Use the $http.get() method

to obtain an ordinary text data

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

Send data to the server (this You need to pass the second parameter {a:1, b:2} to the get method, which is the data to be sent)

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

2. Use the $http.post() method

At this time, you need to pass the third parameter {emulateJSON: true} to the post method

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

3. Use the $http.jsonp() method

Visit 360 search interface

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

Visit baidu search interface

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);
});

The above is the detailed content of How vue interacts with the backend. For more information, please follow other related articles on the PHP Chinese website!