Uncaught Error: []: getActivePinia was called with no active Pinia. Did you forget to install pini

虽然不明白原理,但是确实可用了。

在router中使用pinia(getActivePinia was called with no active Pinia. Did you forget to install pinia)报错解决
使用vue3+ts+pinia开发项目中,我相信好多人使用vuex的传统思想在router中使用,但是用这种思想对于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还是有一些小坑的。
 

你可能感兴趣的:(vue.js,前端,pinia)