欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

Vue的axios请求(get请求)

程序员文章站 2022-07-04 21:19:48
...

1. 首先在Vue项目中安装axios

$ npm install --save axios

2. 在项目main.js 里 引入axios 如下:

import axios from 'axios'
Vue.prototype.$http = axios

3. 在需要使用axios的组件(.vue) 文件

import axios from ‘axios’

4. 在组件 methods的函数中,使用axios

methods: {
    getdata: function() {
        var url = "https://cnodejs.org/api/v1/topics";
        // 发送请求:将数据返回到一个回到函数中
        var that = this;
            // 并且响应成功以后会执行then方法中的回调函数
        axios.get(url).then(function(result) {
            // result是所有的返回回来的数据
            // 包括了响应报文行
            // 响应报文头
            // 响应报文体
            console.log(result.data.data);
            that.goodlist = result.data.data;

        });
    }
}

5. 在组件的某标签中设置@click事件,调用函数(请求数据)

<v-btn @click="getdata"></v-btn>
相关标签: Vue vue