Vue3使用axios

package.json:

"axios": "^1.3.4",
"vue-axios": "^3.5.2"

main.js:

import {createApp} from 'vue'
import App from './App.vue'
import Router from './router'
import 'bootstrap/dist/css/bootstrap.min.css'
import 'bootstrap/dist/js/bootstrap.min.js'
import axios from 'axios'



const app = createApp(App)
app.use(Router).mount('#app')
app.config.globalProperties.$axios=axios;

使用，注意setup()方法没有了this:

  import {getCurrentInstance} from "@vue/runtime-core";

    export default {
        name: "ComponentA",
        data() {
            return {
                stus: [
                    {"id": 1, "name": "小明", "gender": "男", "age": 20},
                    {"id": 2, "name": "小明", "gender": "男", "age": 22}

                ]
            }
        },
        setup() {

            const { proxy } = getCurrentInstance()

            proxy.$axios({
                method: "get",
                url: "http://localhost:8090/stu",
            }).then(res => {
                proxy.stus=res.data;
            })

        }
    }

后端：