vue3在路由route.js中获取不到仓库pinia中store里面的值

最新推荐文章于 2024-07-10 13:29:46 发布
最新推荐文章于 2024-07-10 13:29:46 发布
阅读量296 收藏
点赞数 2
文章标签： javascript vue.js 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_50512645/article/details/138118602
版权
文章讲述了在Vue应用中，小仓库useUserStore依赖大仓库pinia，由于route.js不是Vue组件，未挂载pinia导致无法运行。解决方案是导入UserStore并在非组件环境下初始化store。
摘要由CSDN通过智能技术生成

原因：小仓库(useUserStore )必须有大仓库(pinia)才能运行，在组件中能使用pinia仓库的数据，是因为在main.ts中已经在vue上面挂载了大仓库(pinia)，但是route.js不是vue组件，没有被挂载大仓库，所以不能运行

解决

引入UserStore

import { UserStore } from '@/store/models/user/index.ts'

在函数内初始化store

const store = UserStore()

秋田弘
关注
  • 2
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
在Vue中使用this.$store或者是$route一直报错的解决
10-16
今天小编就为大家分享一篇在Vue中使用this.$store或者是$route一直报错的解决，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
vite vue3 import.meta.glob动态路由
03-29
在Vue 3应用程序中，Vite提供了一种高效的方式来实现动态路由。Vite是一个由Vue.js作者尤雨溪开发的现代Web应用构建工具，它利用了ES模块的原生加载能力，提供了更快的开发环境启动速度和更简洁的配置。在Vite与Vue ...
在js文件里获取store里的变量
STATICHIT静砸的博客
12-04 2927
直接使用this.$store.state.xxx是不行的，会报错。想获取很简单。先引用store文件，再调用。例如我项目中把token存入store。在封装请求的http.js文件中，这样子获取。
vue3在router中使用pinia报错解决
IU
05-07 445
vue3在router文件中使用pinia报错的问题解决
记录一下uniapp中使用vue3+Pinia开发小程序时使用持久化存储报错sessionStroage is undefined
qq_53171104的博客
06-28 288
其实就是持久化pinia-plugin-persiste内部错误处理并不理想 小程序没有sessionStroage这个概念 没有使用try catch去捕获错误 导致第一时间没有获取到store里面的数据。使用pinia-plugin-persistedstate就可以了。然后在页面中引入usePiniaStroe并调用就可以玩耍了。新建store目录index文件夹（按需来）
pinia使用函数式写法，在vueDev浏览器开发者工具中，state中不显示store里的值
hua4st的博客
04-16 262
查阅官方文档后可知,函数式写法中，属性需为响应式数据。如图所示，state中不显示数据。将数据更改为响应式数据后解决。
vue3 路由切换后，页面不显示内容，刷新后正常显示
qq_45469341的博客
05-27 1474
这个白屏问题我是第一次遇到，所以想完整记录一下，本文也借鉴了一下别人的。
解决vue3 路由切换后，页面不显示内容，刷新后正常显示（路由切换白屏的问题）
热门推荐
weixin_43185419的博客
06-13 1万+
正常使用时切换路由都可以正常地切换页面，但是页面长时间无操作就会浮现该问题。使用导航切换路由，路由可以正常跳转，地址栏有变化，但页面不显示。在router-view 中给路由添加key标识。2、切换的各级页面均有根标签节点包裹。
vue项目遇到的问题---登陆后跳转到首页没有获取到数据，手动刷新才可以
weixin_51938803的博客
05-09 1750
一、我做的项目是这样的，首先进入的页面是layout页面,然后再重定向到子页面home首页中，因为要判断用户是否登录，所以在前置路由守卫那里做了判断，如果未登录，则强行跳转到我的页面中进行登录，然后就出现了问题，登录成功后跳转到首页的时候，数据没有获取到，但刷新的时候就有了。因为在第一次进入首页的时候，home页面的created已经执行了一次，再次通过登录进来的话created就不会执行，如果手动刷新的话，created会重新执行，所以会获取到数据。
vue3中router和store详细使用教程方法vuex和route.zip
04-24
在Vue3中，`router`和`store`是两个核心组件，它们分别是路由管理和状态管理的解决方案。Vue Router是官方的路由库，用于处理页面间的导航和数据传递；Vuex则是状态管理工具，用于集中管理组件间的共享状态。在本...
Vue路由对象属性 .meta $route.matched详解
12-13
$route.fullPath 1 路由是：/path/:type真正路径是：/path/list 2 path匹配路径: /path/list 3 fullPath匹配路由: /path/:type 路由元信息 .meta const router = new VueRouter({ routes: [ { path: '/foo', ...
vue.js this.$router.push获取不到params参数问题
10-15
在Vue.js中，路由是应用状态管理的重要组成部分，特别是当你使用Vue Router进行单页应用（SPA）开发时。`this.$router.push`方法是用于导航到新的路由的关键函数，但有时候我们在传递`params`参数时可能会遇到一些...
vue3属性pinia（store）数据丢失-记录一下
qq_48109675的博客
04-30 543
vue3刷新pinia数据丢失问题
Vue3+Pinia 在子组件中无法获取最新状态属性
最新发布
sky8880的博客
07-10 125
Vue3+Pinia 父组件中设置状态属性，在子组件中无法获取最新状态属性
vue3中把token存放在vuex中总是失败了
weixin_48950142的博客
08-29 143
然后我就发现一直报错！在store/index新建。
uniapp vue3 使用pinia存储 并获取数据
HQ\(^o^)/的博客
10-17 1532
【代码】uniapp vue3 使用pinia存储数据。
在router中使用pinia报错解决
weixin_46054431的博客
05-14 8275
在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 "pini
vue的store的index.js文件应该怎么写(pinia版)
05-23
Pinia 是一个基于 Vue 3 的状态管理库，相比于 Vuex，它更加轻量且易于使用。下面是一个基本的 `store/index.js` 文件的模板： ```js import { defineStore } from 'pinia' export const useStore = defineStore('store', { state: () => ({ // 状态属性 }), actions: { // 异步操作 }, getters: { // 计算属性 }, // 可选的 mutation 及其操作 // mutations: {} }) ``` 在这个文件中，我们首先引入 `defineStore` 函数，它是创建 Pinia Store 的工厂函数。接着，我们定义了一个名为 `useStore` 的常量，它是通过 `defineStore` 创建的一个 Store 实例。 在 `defineStore` 的第一个参数中，我们需要传递一个字符串，用于标识当前 Store 的名称，这个名称也会作为该 Store 在应用程序中的命名空间。 在 `state` 中我们定义了该 Store 的状态属性，这些属性可以通过 `this.$store` 或 `useStore()` 来访问。注意，在 Pinia 中，状态属性使用函数返回值的形式定义，这是为了确保每个组件实例都有自己的状态副本。 在 `actions` 中，我们可以定义异步操作，这些操作可以使用 `await` 关键字来等待异步的结果。异步操作可以通过 `this.$store` 或 `useStore()` 来访问。 在 `getters` 中，我们可以定义计算属性，它们将根据 Store 的状态属性进行计算。计算属性可以通过 `this.$store` 或 `useStore()` 来访问。 最后，我们还可以定义 `mutations`，它们是用于修改状态的同步操作。在 Pinia 中，mutations 是可选的，因为我们可以直接使用状态属性的赋值操作来修改状态。如果你需要使用 mutations，请在 `defineStore` 中传递一个包含 `mutations` 的对象。 以上是一个基本的 `store/index.js` 文件的模板，你可以根据自己的需要进行修改和扩展。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值