Pinia 踩坑记录

1、子store中如何使用router

以user.ts 这个store为例

错误写法

js 复制代码
// 说明:不能使用插件实例化router,否则获取不到router的函数
//	错误写法如下:
	import { useRouter } from "vue-router"
	actions:{
		login(){
			const router = useRouter()
			// 不信你在这里打印router,最终得到的值是undefined  
			console.log(router) // undefined
			router.push('/') // router都取不到更别说跳转了
		}
	}

正确写法

js 复制代码
import router from "@/router"; // 引入自己封装的路由  

actions:{
		login(){
			console.log(router) // 可以获取到router的实例对象
			router.push('/') // 可以跳转
		}
	}

2、router.ts中如何使用store

必须在函数体中实例,否则会报未能找到pinia,让你安装pinia的警告

错误写法

js 复制代码
import { useUserStore } from "@/store";
const useUser = useUserStore();
 
router.beforeEach((to, from, next) => {
  console.log(useUser.loginForm) // 这里是取不到store的
});

正确写法

js 复制代码
import { useUserStore } from "@/store";

router.beforeEach((to, from, next) => {
  const useUser = useUserStore();
  console.log(useUser.loginForm) // 这样就可以取出store的值了
});
相关推荐
你要飞3 分钟前
第一课:英语简单句的构成与运用
笔记·考研
oak隔壁找我4 分钟前
JavaScript 的函数方法apply、call和bind
javascript
HashTang6 分钟前
【AI 编程实战】第 5 篇:Pinia 状态管理 - 从混乱代码到优雅架构
前端·vue.js·ai编程
青莲8436 分钟前
Kotlin Flow 深度探索与实践指南——上部:基础与核心篇
android·前端
Bug生活20488 分钟前
五年断更,AI助我半天复活小程序
前端·微信小程序·ai编程
狗头大军之江苏分军8 分钟前
Node.js 性能优化实践,但老板只关心是否能跑
前端·后端
恋猫de小郭13 分钟前
2025 年终醒悟,AI 让我误以为自己很强,未来程序员的转型之路
android·前端·flutter
用泥种荷花16 分钟前
【前端学习AI】PromptTemplate的使用
前端
狗头大军之江苏分军18 分钟前
Node.js 真香,但每次部署都想砸电脑
前端·javascript·后端
2501_9462243119 分钟前
旅行记录应用关于应用 - Cordova & OpenHarmony 混合开发实战
javascript·harmonyos·harvester