标签 pinia 下的文章

Nuxt3使用pinia并持久化处理，同时配置自动引入自定义的仓库store模块

木灵鱼儿 8月前 nuxt

Nuxt3使用pinia并持久化处理，同时配置自动引入自定义的仓库store模块

前言需要注意的是，我们的pinia仓库持久化操作只有在客户端渲染时操作才能触发，比如当第一次访问页面时，你可能直接在setup中给仓库存储内容，这是无效的，我们需要保证在客户端渲染时触发才行，比较好的办法就是在onMounted生命钩子中触发。究其原因就是服务端是没法操作local、cookie这些浏览器配置，而在setup中的代码，是会在服务端也运行的，这就可能导致部分代码到了客户端不再运行。教程安装依赖pnpm i @pinia/nuxt @pinia-plugin-persistedstate/nuxt安装成功后在nuxt.config.ts中配置模块：// nuxt.config...

2572 99 0

自动引入 pinia Nuxt3

修复pinia使用setup语法导致$reset报错

木灵鱼儿 11月前 vue 项目实战

修复pinia使用setup语法导致$reset报错

前言在pinia中使用setup语法是非常舒服的一件事情，但是也会有一些坑点，其中就是当我们使用store.$reset()进行重置的时候会发生报错：Store "xxxx" is built using the setup syntax and does not implement $reset()意思是$reset并没有实现，我们需要自己手动实现这个。教程解决办法我是从stackoverflow看到的，这里放出出处：《Pinia: $reset alternative when using setup syntax》我们需要创建一个插件去实现这个功能：stores...

1873 15 0

pinia setup $reset

pinia 5 大顶级技巧解析

木灵鱼儿 1年前 vue 项目实战

pinia 5 大顶级技巧解析

前言pinia的作者最近在博客上放出了一篇pinia的使用文章：《My Top 5 Tips for using Pinia》，里面讲述了5个一般不怎么知道的使用技巧，但是由于讲的很浅，我这边自己理解了一下，做了一些解释，顺带记个笔记。不要创建无用的 getter这点我感同身受，在最初学习vuex的时候，前辈们总是会说，getter有缓存，性能会更好，于是，在大多数的教程中，我们总是能看到这种示例写法：export default Vuex.Store({ state: () => ({ counter: 0 }), getters: { ...

1428 4 0

inject pinia getter

使用vue2.7的一些踩坑事项

木灵鱼儿 2年前 vue 项目实战

使用vue2.7的一些踩坑事项

eslint校验的一些问题（暂时无解）在初始化项目时勾选了eslint校验之后，升级vue 2.7版本后，eslint-plugin-vue这个插件需要升级到9+版本，我目前使用的版本是："eslint-plugin-vue": "^9.4.0"具体的一些可以参考官方提供的2.7升级指南：2.7日志官方居然把这个写在了变更日志里面，按道理最好官方的文档上也有一份说明的，但是目前没有。虽然eslint的依赖更新到新版后确实解决了一些项目启动报错的问题，但是有时候我们的SFC单文件组件开发的时候，template中的一些变量绑定还是会出现波浪线警告，这...

5840 80 1

vue vuex vue-router

标签：pinia

Nuxt3使用pinia并持久化处理，同时配置自动引入自定义的仓库store模块

修复pinia使用setup语法导致$reset报错

pinia 5 大顶级技巧解析

使用vue2.7的一些踩坑事项

最近评论

博客文章RSS订阅

博客评论RSS订阅

登录

标签：pinia

Nuxt3使用pinia并持久化处理，同时配置自动引入自定义的仓库store模块

修复pinia使用setup语法导致$reset报错

pinia 5 大顶级技巧解析

使用vue2.7的一些踩坑事项

最近评论

博客文章RSS订阅

博客评论RSS订阅