vue3+pinia 报错

Question

问题遇到的现象和发生背景

vue3 +pinia
在请求当中加拦截器实现跳转会有加载动画

遇到的现象和发生背景，请写出第一个错误信息

用代码块功能插入代码，请勿粘贴截图。 不用代码块回答率下降 50%

mport axios from 'axios'
import { BASE_URL, TIMEOUT } from './config'
import useMainStore from '@/stores/modules/main'

const mainStore = useMainStore()

class HYRequest {
  constructor(baseURL, timeout=10000) {
    this.instance = axios.create({
      baseURL,
      timeout
    })

    this.instance.interceptors.request.use(config => {
      mainStore.isLoading = true
      return config
    }, err => {
      return err
    })
    this.instance.interceptors.response.use(res => {
      mainStore.isLoading = false
      return res
    }, err => {
      mainStore.isLoading = false
      return err
    })
  }

运行结果及详细报错内容

vue-router.mjs:3451

   ReferenceError: Cannot access 'useloading' before initialization
at index.js?t=1675772436365:8:16

我的解答思路和尝试过的方法，不写自己思路的，回答率下降 60%

百度搜索是变量提升，和执行顺序没搞懂

我想要达到的结果，如果你需要快速回答，请尝试 “付费悬赏”

Answer 1

• 你看下这篇博客吧, 应该有用👉 ：vue3+pinia的使用

Answer 2

这块是代码 上部分截错跪求大佬

import axios  from "axios";


import {BaseUrl,Timout} from './config'
import useloading from "@/pinia/loading";

//简单封装axios 
const loading =useloading()
class Hyrequest{
    constructor(baseURL,timout=1000){
     
        this.intens=axios.create({
            baseURL,
            timout
        })
        请求拦截器
        this.intens.interceptors.request.use(config => {
            loading.isshowloading = true
            return config
          }, err => {
            return err
          })
          this.intens.interceptors.response.use(config=>{
            loading.isshowloading = false
            return config
          },err=>{
            return err
          })
    }
    
    request(config){
        // loading.isshowloading=true
        return new Promise((resolve,rejest)=>{
            // loading.isshowloading=false
            //then 返回成功的函数
            this.intens.request(config).then(res=>{
              resolve(res.data)
            }
            ).catch(err=>{
                // loading.isshowloading=false
                rejest(err)
            })

        })
    }
    get(config){
          return this.request({...config, method:"get"})
    }
    post(config){
        return this.request({...config, method:"post"})
  }
}
export default new Hyrequest(BaseUrl,Timout)