vue3整合axios，无法发送请求

vue3整合axios，发送请求的时候在前端页面f12打开后发现报错：

Uncaught (in promise) TypeError: $axios is not a function
    at Proxy.handleBeforeOk (QuantHeader.vue?e687:63:1)
    at eval (modal.vue_vue&type=script&lang.js?576c:259:1)
    at new Promise (<anonymous>)
    at handleOk (modal.vue_vue&type=script&lang.js?576c:257:1)
    at callWithErrorHandling (runtime-core.esm-bundler.js?d2dd:155:1)
    at callWithAsyncErrorHandling (runtime-core.esm-bundler.js?d2dd:164:1)
    at emit$1 (runtime-core.esm-bundler.js?d2dd:711:1)
    at eval (runtime-core.esm-bundler.js?d2dd:7372:1)
    at Proxy.handleClick (button.js?0931:82:1)
    at _ctx.href.onClick._cache.<computed>._cache.<computed> (button.js?0931:123:1)

我怀疑是没有安装成功（卸载了，重新部署也是这样，那不就是没安装成功呗）但是重新安装后明明显示了加入5个packages。
后端项目的跨域问题也提前处理了，不该是跨域问题。

发送请求的代码如下：

```javascript
import { reactive, ref, inject } from 'vue';
        const $axios = inject("$axios");
        const handleBeforeOk = (done) => {
          
            $axios({ //f12调试发现在这行有红色波浪线）
                url: "http://localhost:9001/member/login.do",
                method: "post",
                data: "acctName=" + form.name + "&authstring=" + form.pwd,
                headers: {
                }
            }).then((res) => {
                if (res.data.status == 0) {
                    loginerror.value = false;
                    needLogin.value = false;
                    done();
                } else {
                    loginerror.value = true;
                    needLogin.value = true;
                    done(false);
                }
            }).catch((res) => {
            }); 
        }

main.js

import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
import axios from 'axios';
const axi = axios.create({
    baseURL:"http:localhost:9001"
});
app.provide('axios',axi)

有懂的老哥解答吗，先谢过了！[抱拳]

Vue.prototype.$axios = axios;