垃圾站 生活小记 解决在router中使用pinia报错"getActivePinia was called with no active Pinia"

解决在router中使用pinia报错"getActivePinia was called with no active Pinia"

使用vue3+ts+pinia开发项目中,我相信好多人使用vuex的传统思想在router中使用,但是用这种思想对于pinia就行不通了就会报错,报错如下:(getActivePinia was called with no active Pinia. Did you forget to install pinia),下面是简单的解决方案,如有更好的希望大家留言分享。

一、使用步骤

1.首先创建store.ts文件

import { createPinia } from "pinia";
const pinia = createpinia();
export default pinia;
代替在main.ts中的那种形式创建。

2.在mian.ts中引入

// 替代传统的在main.ts中直接导入的形式
import { createApp } from "vue"
import App from './App.vue'
import pinia from "./store/store"

const app = createApp(App)
app.use(pinia)

3.在router.ts中使用pinia

import { createRouter, createWebHistory } from 'vue-router'
import pinia from '../store/store' 
import { useUser} from "../store/useUser"
const store = useUser(pinia)// 这里一定要把 pinia传入进去
console.log(store) 
之后就可以随意使用store这里边的方法以及属性

总结

提示:小伙伴有更好的方案的话欢迎提出:

使用pinia替代vuex还是有一些小坑的,欢迎大家一块分享。不喜勿喷谢谢。

上一篇
下一篇

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注

联系我们

联系我们

返回顶部