问题标签 [vue-mixin]

我有一个动态 id 的路由，例如 post/:postId 和包含很多方法和函数的可组合函数。

当我从路线 post/1 到 post/2 可组合没有更新并且我得到了 id 1 的信息

如何强制重新初始化可组合功能？

我有Vue+TypeScript项目，我们正在使用Vue class components. 组件的方法之一被移动到单独的 mixin。该 mixin 使用组件的属性。为了防止TypeScript' 抱怨缺少 mixin 属性，我创建了与 mixin 同名的接口：

然后像这样将mixin连接到我的组件：

之后，我收到文本错误：

类“PageVouchersTable”错误地扩展了基类“ExpSelectedHandlerMixin & Vue & object & Record<never, any>”。类型“PageVouchersTable”不可分配给类型“ExpSelectedHandlerMixin”。属性“加载”在“PageVouchersTable”类型中是私有的，但在“ExpSelectedHandlerMixin”类型中不是私有的。

好的，我在组件中创建了loading, selected, currentApplication,items属性public（只是删除了private修饰符）。

这样可行。

但：

是否有可能以某种方式连接使用组件属性的mixin而不创建这些属性public？

我知道mixins在 Vue 中可以通过 a 全局创建plugin或单独导入到选定的组件。

全局选项似乎更有吸引力，因为您不需要处理所有详细的导入，它使组件代码更短，因此更简洁。

对所有混合使用全局混合有什么缺点吗？它会以任何方式阻碍性能吗？我能想到的一个负面后果是对 mixin 属性命名的限制，因此它们不会覆盖其他组件属性，反之亦然，但这似乎不是很苛刻。还有别的事吗？

我想创建一个单独的文件中的全局混合。我在网上看到的所有教程总是将 mixin 放在同一个文件中，或者不解释如何导入另一个文件。

如果 mixin 都在同一个文件中，那么它们就没有任何意义，所以必须有某种方法可以从不同的文件中加载它们，对吧？

这是我的测试 mixin_test.js：

在 app.js 我有以下内容：

在我的组件中：

如果我在网络浏览器中打开页面，我会收到错误消息：

有谁知道问题是什么？

我有一个显示日志条目信息的 Vue 组件。在我的页面上，我有一个 for 循环，它为每个日志条目实例化这个组件。我可以从 0 到任何地方 - 可能有 100 多个日志。

我有一个 mixin，其中包含一些可以在我的应用程序中使用的方法，例如通过 ID 查找用户的方法。

我的问题是，如果我在日志条目组件中使用 mixin，我的应用程序会受到什么样的性能影响？

我在想，如果我的日志条目组件在页面上实例化 50 次，我的应用程序正在加载 mixin 50 次。不过我想知道，Vue 是否能够协调所有重复的代码？

我有一个全局混合，除了在App.vue.This mixin 应该加载一个 Yaml 配置文件并使其在任何地方都可用。

所以问题是¿为什么它只在其中不起作用App.vue以及如何解决它？

主.js：

yaml 文件：

应用程序.vue：

这是错误：

解决方案我试过了，仍然没有解决这个问题

应用程序.vue：

但我仍然得到未定义的错误：

我正在将一个项目从 JS 转换为 vue 中的 TS。问题是，我正在使用带有 mixin 的组件。我的 TS 声明在 .ts 文件中，这是我的 mixin 文件。当我尝试在我的主要组件的类中访问这些声明时，我可以访问。但我无法在模板中访问它们。这是一些代码：

主.vue

myMixin.ts

如您所见，我可以从脚本（在课堂上）访问它。那么如何在模板中访问它呢？

任何帮助将不胜感激。谢谢。

我已经为此苦苦挣扎了大约一个星期，所以如果有人知道，如果您能提供帮助，我将不胜感激。

我一直在将基于 vue2 的代码转换为 vue3 作为一个新项目。我不使用 coposition api，而是将其用作基于对象的组件方式。

由于用 typscript 编写的外部模块也被导入和使用，因此该组件用 defineComponent() 包装。

一切正常，但全局 mixin 部分是问题所在。正如vue官方文档中描述的那样，用*.js编写的mixin通过app.mixin()注册为全局mixin。

如果我在组件文件中调用 this.registerBackButtonCallback() ，

'类型'从不'没有呼叫签名'

错误和编译失败。但是当我将它用作本地混合时，调用 this.registerBackButtonCallback() 效果很好。

仅当设置了 <script lang="ts"> 时才会发生错误。当“tsconfig.json”中的“strict”或“noImplicitThis”选项设置为false时，它编译不会出错。

由于上述原因，我认为这个错误一定与 typescript 有关。我认为进行类型论证会很好，所以在 src/shims-vue.d.ts 中，就像下面的一样，我尝试添加它，但我仍然得到错误。

有没有人尝试在 vue3 组件中使用脚本 lang="ts" 调用全局 mixin 的方法？

非常感谢您的建议。