问题标签 [pinia]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
0 回答
180 浏览

vuejs3 - Pinia w/Vue3:在模板中使用操作返回 funcName 不是函数

在 Vue3 的模板中使用 Pinia 动作给出

未捕获的类型错误:$setup.[storeName].[actionName] 不是函数

我做错了什么还是预期的行为。似乎没有其他人有同样的问题。谷歌搜索没有透露任何内容。

我正在使用新组件

0 投票
2 回答
1315 浏览

typescript - 如何在 pinia 中设置状态对象的类型?

我正在制作一个国际象棋游戏,我正在使用 Vue 3 和带有 Pinia 的 TypeScript 进行状态管理。

我想做如下的事情:

更新GameState.vue

但是,我在以下行中收到错误消息:

那个 currentPiece(类型 Piece)不能分配给 undefined 类型。通过在我的商店中执行以下操作,我发现了一个 hack 来让它工作:

但这感觉很糟糕。是否有另一种方法可以在初始状态返回中键入 previousPieceSelected?

0 投票
1 回答
334 浏览

vuejs3 - 在 PINIA、Vue3+Typescript 上处理命名空间模块化方法

通常我使用的是命名空间的 vuex。但我决定退出vuex,因为Pinia有 vue 核心团队的支持。我认为这对未来的发展更好。现在我正在使用模块化方法创建商店,但无法真正理解如何在 typescript 项目中处理该部分。

假设我有一个user界面。

store/modules/state.ts我调用 Type 并创建用户状态。

store/modules/index.ts我应该导入状态。然后将namespace: true其导出为 pinia 商店的 defineStore()。

store/index.ts

好了上面,命名空间部分我用的是vuex的方式。但是,松果的正确方法是什么。此外,吸气剂和动作也是如此。应该如何导出和使用它们。

0 投票
2 回答
137 浏览

pinia - 如何在 js 文件中的组件之外使用 Pinia

我正在从 vue 4.x 迁移到 pinia,我的一个文件需要来自 store 的 api 密钥。但即使我遵循Pinia 文档,我也可以让它工作。这是我如何使用pinia

// 存储库.ts

预期结果:从商店获取令牌。

控制台错误

0 投票
3 回答
511 浏览

vue.js - 不能在单个商店内使用 vue-router 和 pinia

我正在使用 pinia 和 vue-router 4.x ,但我在商店中使用它们时遇到问题。每个人都独立工作,但不能一起工作。

如果我使用

路由器可以工作,但 pinia 失败并出现错误

//这里是axiosroot.ts

当我从 vue-router 导入路由器时useRouter未定义

错误

// 这里是剩下的相关代码

0 投票
2 回答
1083 浏览

vue.js - Vue:在进入 vue-router 之前无法访问 Pinia Store

我正在使用 Vue 3,包括 Composition API 和 Pinia 作为状态管理。

在选项 API 中有一个方法 beforeRouteEnter,它内置在组件本身中。不幸的是,组合 API 中不存在此方法。这里的代码,本来应该在 beforeRouteEnter 方法中,被直接写入到 setup 方法中。但是,这意味着首先加载和显示组件,然后执行代码,如果检查失败,例如,组件将被重定向到错误页面。

我的想法是直接在路由的 beforeEnter 方法中的路由配置中进行检查。但是,我无法访问 Pinia Store,它似乎还没有被初始化,尽管它之前在 main.js 中被调用过。

控制台日志

路由器.js

main.js

0 投票
1 回答
41 浏览

typescript - “只读”类型上不存在属性“forEach”>>'

这是在 vue3 (pinia) aonf 中使用 vue 3 中的组合 api 进行状态管理时出现的问题,在获得来自 countryCodes 的成功查询结果(数组)后,我想将 countryCodes 数组的所有项目复制到中定义的国家数组中状态,但是在使用 forEach 方法以及其他几种克隆数组的方法时,我遇到了错误“属性 'forEach' 在类型 'Readonly<Ref<Readonly>>' 上不存在”“注意:我正在使用类型脚本,如何解决这个问题?

0 投票
1 回答
145 浏览

typescript - 使用 nuxt 的 pinia 商店中的状态类型应该是什么

我正在使用 pinia 与 nuxt 和 typescript 来创建商店。

这是 auth store 的代码(带有 nuxt auth 模块)-

现在的问题是,IDE 给出了打字稿错误 -

类型“{} 和 {}”上不存在属性“$nuxt”。ts(2339)

0 投票
1 回答
105 浏览

javascript - 从参数化的 getter 访问 getter

tl;博士

如何从参数化的 getter 访问其他 getter?通常,您可以使用this.myGetter; 但是参数化的 getter 实现为箭头函数,其中this未定义。在 Pinia 中处理这种情况的首选方式是什么?


我想multiSum在我的 Pinia 商店中创建一个参数化的 getter (),它可以访问另一个 getter ( sum)。

Getter 可以通过 访问this,但这在用于实现参数化 getter 的箭头函数中不起作用:因为在嵌套箭头函数的上下文中而multiSum崩溃。thisundefined

在 Vuex 中,参数化的 getter 可以通过参数而不是 来访问其他 getter this,这也适用于箭头函数。但是 afaik 这个 API 在 Pinia 中不存在。

我可以通过捕获 store 实例来解决这个问题:

这有效,但非常冗长。有没有更好(更符合框架)的方法来做到这一点?

0 投票
0 回答
28 浏览

pinia - 我可以在不安装 vue 的情况下使用 pinia 吗?

我怎么能在没有 vue 和 vite 的情况下使用 pinia?

我尝试像这样使用松果:

我使用节点来运行它:node test

但它返回错误