问题标签 [vue-class-components]

yarn dev 返回此错误。

我正在使用带有打字稿的 vue。

这是我的 ts-config.json

这是我的 main.ts

这是我的 app.vue

如果我在 app.vue 中没有 ts 代码运行没问题。使用 app.vue 终端中的 ts 代码显示此错误并且未运行我的应用程序。

我想将我的 vuejs 项目升级为基于类组件的打字稿，但我在 vue 问题的https://github.com/vuejs/rfcs/pull/17#issuecomment-494242121中阅读：

更新：Class API 提案正在被删除。

那么现有的基于类组件的项目会发生什么？更重要的是，基于这篇文章： https ://alligator.io/vuejs/using-typescript-with-vue/它说

由于我们没有使用类样式语法，因此您使用 as 关键字将数据声明为数据类型。

这种在 vue3.0 中使用 typescript 的方式安全吗？

我有 3 个组件，一个显示评论，一个显示评论列表，一个管理应该显示的内容。

当用户单击评论时，Comment 组件会发出一个“comment-selected”事件，并且 CommentsList 组件会监听它以将其转发（也通过执行 $emit）到 CommentsView 组件。

所以基本上我必须将一个事件从一个组件传递给祖父母。

Comment 和 CommentsList 之间的通信正在工作，我可以在 Vue 开发工具中看到 CommentsList 中的第二个 $emit 也在工作，但从未触发 CommentsView 上的侦听器。

但是，如果我在 CommentsList 中执行相同的 $emit，但在其他地方，例如在 mount() 而不是“comment-selected”事件侦听器中，它会起作用。

以下是组件：

为什么这不起作用？

我想使用来自https://github.com/vuejs/vue-class-component的新 Vue 语法。不幸的是，我无法访问通过v-model. v-model我可以改为声明一个 @value 属性来传递值，但鉴于我的代码库中有很多现有用途，这似乎有点不一致。

当前代码可以通过以下方式访问：

我想通过以下方式访问：

我将 vue-class-component 与 TypeScript 一起用于我的 Vue 项目。我有它的组件和 Mixin：

它可以工作，但 TypeScript 抱怨缺少属性“compValue”。如何解决这个问题？

最近我将我们的 vue.js2.x 项目迁移到 typescript，并基于 evan-you 在本期的评论：

https://github.com/vuejs/rfcs/pull/17#issuecomment-494242121

类 API 提案正在被放弃。所以我使用的是基于常规选项的 vue.js 版本，它给我带来了很多类型问题。

我想知道 vuejs2.x composition api 是否与 typescript 完全兼容？我应该用它来解决所有问题吗？在这种情况下，最佳做法是什么？

有谁知道如何正确地告诉 TypeScript 如何了解我在第一张照片上Prop的type权利？

1. 这家伙宣称Prop叫engine。图 1

2. 在这里，我从第一个图片 图像 2扩展组件

3. （与上图相同的组件）问题是 TypeScript 无法正确推断引擎类型图 3

在此之前，我尝试使用 repo 中示例文件夹中的示例：https ://github.com/vuejs/vue-class-component/blob/master/example/src/App.vue但它对我没有帮助。

我的代码有问题还是我必须engine在组件上明确声明类的属性EmSearchEngine？

非常感谢您的帮助。原始github的问题：https ://github.com/vuejs/vue-class-component/issues/391

我有一个简单的打字稿组件类，需要一个道具：

我很想在不同的打字稿组件类中初始化这个类以获得特定的实例变量：

这给了我一个明显的错误：

所以我将初始化更改为：

这仍然给我一个类型错误，因为我并没有真正传递任何东西：

不需要道具，此代码在不同情况下对我来说非常适合。但是，我无法通过传递道具来完成这项工作。我该怎么做？

编辑：

像这样传递道具也不起作用：

结果导致此错误：

所需格式的类型：

我想使用mousedown,mousemove和mouseup事件来实现可拖动的线。

在我的第一次尝试中，我尝试使用箭头函数类属性：https ://codesandbox.io/s/example-1-15psm?fontsize=14&hidenavigation=1&theme=dark

但是positionin的属性Test.vue似乎是非反应性的。不确定，但我猜是因为这个Vue 限制：

不要在选项属性或回调上使用箭头函数，例如created: () => console.log(this.a)or vm.$watch('a', newValue => this.myMethod())。由于箭头函数没有this,this将被视为任何其他变量并通过父作用域进行词法查找直到找到，通常会导致诸如 UncaughtTypeError: Cannot read property of undefined或Uncaught TypeError: this.myMethod is not a function.

在我的第二次尝试中，我尝试使用标准类方法： https ://codesandbox.io/s/example-2-t7beu?fontsize=14&hidenavigation=1&theme=dark

它可以工作，除非因为绑定的函数onMouseMove和onMouseUpinTest.vue是匿名的，我不能用removeEventListener.

那么，在 Vue 类组件中使用addEventListenerand的正确方法是什么？removeEventListener

我正在使用 Typescript Class 组件，但我遇到了无法使用的问题this.$refs.<refname>.focus()

模板代码：

此输入字段位于弹出窗口中。

打字稿代码：

然后我得到这个错误：

此问题已在此问题中修复Vuejs typescript this.$refs..value does not exist 添加：

我的控制台出现新错误

7

有没有办法做到这一点？