环境:Vue3 + router4 + pinia
有个项目中我使用pinia创建了个loadingStore 专门用于是否在加载中,于是就在二次封装的request.ts文件中使用了,但是我的登录是个全局的组件,所以就将登录弹窗的所有信息放在了loginStore中。
但是我在loginStore中使用登录接口的时候,发现报错:
"getActivePinia()" was called but there was no active Pinia. Did you forget to install pinia?
// request.ts
import axios from 'axios';
import {useLoadingStore} from "@/store/loading";
...
const loading = useLoadingStore()
这意思可能是pinia用到了但是没找到。在网上找到个答案。
// request.ts
import axios from 'axios';
import {useLoadingStore} from "@/store/loading";
import pinia from "@/utils/plugins/store"; // 加了这行
...
const loading = useLoadingStore(pinia) // 将pinia传进去
这样一来问题就解决了 这个pinia就是main.ts里app.use要引用的pinia 如果不是单独的文件 指定导出也行 希望可以帮到大家 原文地址:www.yii666.com/blog/450014…
后续更新:根据上面的方法 会导致pinia持久化存储插件失效 解决方法就是一切使用到的仓库都在方法内使用,也无需在使用到的ts文件中给引入的仓库传递pinia了,原文链接:pinia一个模块引入另一个模块报错“getActivePinia()“ was called but there was no active Pinia._亦非余的博客-CSDN博客
import axios from 'axios';
import { message } from 'ant-design-vue';
import {useLoadingStore} from "@/store/loading";
import {useUserInfoStore} from "@/store/userInfo";
...
requests.interceptors.request.use((config) => {
const userInfo = useUserInfoStore()
const loading = useLoadingStore()
Object.assign(config.headers,{token:userInfo.token})
loading.setLoading(true)
return config
})