问题标签 [vuex4]

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 投票
1 回答
58 浏览

nuxt.js - 如何将通过突变存储的有效负载

使用@click 事件添加数字但不起作用。

计数器.vue

在 main.js 上

没有错误,但 addToCounter 不起作用,而在触发 @click 时应该将值添加到计数器。

当我们点击 + 按钮时,应该添加上面的数字

0 投票
0 回答
30 浏览

vuejs3 - Vuex4 和 Vue3 - Devtool 中未更新的状态

我在我的项目中使用 Vuex4.0.1 和 Vue3。我在让 Chrome Devtool 中的 Vuex 状态正常运行时遇到问题。我可以看到初始状态,但它们在 Devtool 中始终保持不变。

我试过添加

app.config.devtools = true;

但它仍然不起作用。

所有的状态、突变、getter、动作在代码中都能正常工作。只是我在devtool中看不到更新的状态,这让调试更加困难。如果有人可以提供帮助,将不胜感激。

我找到了这个 Github 线程,但不确定将 Vuex 升级到 v4.0.1 后我还应该做什么。

0 投票
0 回答
377 浏览

google-chrome - Google Chrome 中的 Vue 3 / Vuex v4 开发工具在哪里?

我在 Vue 3 和 Vuex 4 项目中工作,并且正在为 vuex 创建我的商店,但在 Chrome 中我缺少用于管理我的 vuex 商店的开发工具。我能够使用 Vue 2 和 Vuex 3.* 做到这一点。这是在进行中吗?

谢谢你。

0 投票
2 回答
80 浏览

vue.js - Vue 3 和 Vuex 4

我将 Vue 3 与组合 API 一起使用,并试图了解如何直接从 Vuex 映射我的状态,以便模板可以使用它并使用 v-model 动态更新它。

是否mapState有效或其他方法可以解决此问题?对,不,我需要通过 getter 获取我的状态,在模板中打印出来,然后为我的状态中的每个字段手动提交......在 Vue 2 和 Vuex 中,我有这个 100% 动态

0 投票
0 回答
411 浏览

typescript - 如何使用 TypeScript + Composition API + Vuex(命名空间)?

我目前正在尝试创建一个 Vue 3 应用程序,该应用程序利用以 TypeScript 编写的 Vuex 4(命名空间)的 Composition API。

有很多不同的方法,但到目前为止,它们都不是很有用。我不想为此使用任何类样式语法或不必要的外部包装器。

这是一个向您展示我的问题的最小示例:

有趣或棘手的部分是从应用程序角度调用。我尝试了几种不同结果的方法。

方法 1(失败):createNamespacedHelpers()使用mapActions或来自 vuex 包的 内置功能useActions不起作用,因为它需要设置 this.$store,而 Vue 3(Composition API)和 Vuex 4 并非如此。

GitHub 使用请求*

方法 2(失败): 使用vuex-composition-helpers需要依赖于@vue/composition-apiVue 3 依赖关系图时会导致依赖关系噩梦。

方法 3(失败): 更接近代码:利用 typedModuleActionTypes来调度操作会导致[vuex] unknown action type: TEST错误,因为useStore()返回的是通用存储而不是子模块。从模块中删除命名空间显然会使其工作。

方法 4(工作): “取消键入”模块的存储并使用纯字符串来调度操作。

此外,可以使用内部和外部操作类型@see 47646176来避免 Vue 组件中的字符串连接。

是否有任何想法或建议仍然可以键入子模块的存储并且命名空间到位?

0 投票
1 回答
279 浏览

python - 带有“import bokeh”的烧瓶,带有 2 个没有外部散景服务器的散景图,而不是“模型只能由一个文档拥有”

TL;博士

我是散景的初学者。

我已经阅读了https://docs.bokeh.org或 stackoverflow 和 github 中的其他示例,但我没有在 Flask 中找到import bokeh具有 2 个没有外部散景服务器的散景图的示例,而不是“模型必须仅由单个文档拥有"

所有示例或教程都适用于 Flask 中嵌入的散景服务器或散景服务器。

2021 年 9 月 9 日:我用烧瓶、散景、vue3、vuex4、composition-api 完成了 POC:https ://github.com/philibe/FlaskVueBokehPOC 。我清理了我的最后一个自动答案,并使用 POC 作为教程创建了一个新答案。

问题

我从下面的散景服务器示例开始,由我通过与共享数据源的交互进行了修改,但是我在转换为import bokeh带有 2 个散景图的 Flask 时遇到了问题,没有外部散景服务器,而不是“模型必须由单个文档拥有”

该问题的预期答案最终是在 Flask 中有一个示例,其中import bokeh包含 2 个没有外部散景服务器的散景图,而不是“模型必须由单个文档拥有”

我修改的初始散景服务器示例:它有效。

bokeh serve main.py --allow-websocket-origin=192.168.1.xxx:5006

散景服务器源(严重)转换为 Flask,import bokeh带有 2 个散景图,没有外部散景服务器,而不是“模型必须由单个文档拥有”

python app_so.py-> http://192.168.1.xxx:5007/stock1

  • 如果数据源不同,一切正常,
  • 如果图中尚未加载数据:“RuntimeError:模型必须由单个文档拥有,Selection(id='1043', ...) 已经在文档中”

我读到常见的解决方法是拥有不同的来源,但我想要共享来源,就像我修改的散景服务器示例一样。

第二次我在下面有这个警告:在 Flask 中是否必须使用 Js 回调来实现散景?

警告:bokeh.embed.util:您正在生成独立的 HTML/JS 输出,但尝试使用真正的 Python 回调(即使用 on_change 或 on_event)。这种组合是行不通的。

只有 JavaScript 回调可以与独立输出一起使用。有关使用 Bokeh 进行 JavaScript 回调的更多信息,请参阅:

app_so.py

index2.html

0 投票
0 回答
26 浏览

vuejs3 - 在 vuejs3 的外部 js 文件中导入 vuex4

我找不到如何将商店导入外部 js 文件。

这是我的文件:

然后我想将此文件导入到组件中以使用该功能。

如果这会改变任何东西,我正在使用 Vitejs。

0 投票
1 回答
40 浏览

vue.js - 使用 VueX 访问数据

我想用 VueX 将我的数据存储在我的 VueJS 项目中。

这是我的index.js

当我在 Home.vue 中这样做时,它正在工作:

但是当我这样做时,没有:

我在控制台中有以下错误:

Vue警告]:在渲染期间访问了属性“tuto”,但未在实例上定义。

但是我认为我在做同样的事情,我不明白为什么它使用数据而不是教程。

谢谢

0 投票
1 回答
875 浏览

vue.js - 在 vuex 商店中访问 app.config.globalProperties

我有一个像这样的 vuex 商店:

现在我想访问app.config.globalProperties.$notify

在 Vue.js2 中,我使用了类似的东西Vue.prototype.$notify,但这不再起作用了。

$notify也是这样提供的:

不幸的是,我还没有在文档中找到任何关于此的信息。

所以我的问题是:我如何在这家商店中注入$notify或访问app.config.globalProperties

0 投票
0 回答
101 浏览

vuejs3 - 在 vue 3 类组件单元测试中未定义 store

我是 vue 3 类组件中单元测试的新手。我收到错误说商店未定义。这是我在 Home.vue 文件中的代码。

我正在使用 jest 进行测试。请帮我解决这个问题。谢谢。