问题标签 [vue-class-components]

我正在将 Vue v2 与 Typescript 一起使用，并且正在尝试扩展父类：

我的父类被调用BaseSelect，看起来像这样：

我的孩子班BaseSelectGender看起来像这样：

当我<base-select-gender>在我的代码中使用时，有两个BaseSelect组件实例（因此有两个不同的valid变量实例）：

1. 由于继承而创建的第一个实例
2. 由于<base-select>在孩子中使用而创建的第二个实例

当变量发生变化时，这会导致一些问题，valid因为变量的错误实例反映在 DOM 中。

所以我现在的问题是：我如何扩展一个基类并使用它，或者至少在我的子组件的模板部分扩展 html 代码？

'Vue | 类型不存在属性'clientWidth' 元素 | Vue[] | 元素[]'。
'Vue | 类型不存在属性'clientHeight' 元素 | Vue[] | 元素[]'。

有什么建议么？我还是 vue 的新手，奇怪的是这段代码以这种方式工作，但它会引发该错误。

在使用类组件装饰器时，我试图访问我的道具，但我不断返回“未定义”。Vue Router 上的文档没有记录对使用 TS 的任何支持。下面是我当前的设置和 Codesanbox 的链接。

代码框：

https://codesandbox.io/s/vuetify-ts-router-forked-tsgsu

路由器.ts：

主.js：

应用程序.vue

汽车.vue：

Carsform.vue

我正在使用 vue-class-component 并且我有一个导入的函数，我想将其用作组件方法的值。为了说明我想要实现的目标，假设我有一个文件 TestComponent.vue，它看起来像这样：

我的 helper.ts 文件是这样的：

问题是我不想this在 helper.ts 中指定any类型。我希望它是一种 TestComponent 类。但是当我输入这个时：

我有一个错误，提示“'Vue' 类型上不存在属性 'someString'”。我找到了解决方案。如果我将一个类定义放到一个单独的文件中，比如说 TestComponentClass.ts，然后在 TestComponent.vue 和 type 中导入它export default class TestComponent extends TestComponentClass {}，我也可以在 helper.ts 中导入这个类并将其用作this函数内的关键字类型。但这似乎太乏味了。

所以我的问题是：

1. 有没有更好的方法来实现这一目标？
2. @Component 装饰器实际上如何影响类的类型？我试图在官方文档中寻找答案，但它没有深入解释这个装饰器的实现。

提前致谢！

我的问题是，在应用程序从服务器后端获取一些数据后，我的 UI 不知何故没有更新。

我有以下代码：

我验证了后端实际上为正确的餐厅提供服务，并在 axios 调用完成后记录了结果。问题是 DOM 没有更新。如果我将以下内容添加到更新的 DOM 中：

在我看来，vue 以某种方式仅在识别对已初始化的空数组的更改而不是当前未初始化的餐厅对象时才更新 DOM。

我进一步得到一个警告： [Vue warn]: Property "restaurant" was accessed during render but is not defined on instance.关于v-if我觉得奇怪的东西，因为这就是它存在的确切原因。我需要如何初始化餐厅，以便通过 axios 的更新被 vue 正确识别？

我在父母那里有这个：

我在孩子身上有这个：

当我更新我的商店并将第一项添加到数组中时，我看到父项呈现该项，但子项显示一个空数组。如果我重新加载页面一切正常，随后添加到数组中的所有内容都会正确显示。

当第一个项目添加到数组时，如何让我的孩子正确更新？

我正在尝试引用shareToPublic(index)<tr v-for="(note, index) in noteList" v-bind:key="index"中的“索引” 。selectedID()方法选择索引并返回当前 ID 号。之后，当我单击“共享”按钮时，它应该将我带到一个页面，该页面显示从 ID 中选择的内容。

我正在努力解决以下问题：我使用 Vue 3 和 Typescript 使用以下代码创建了一个 QRCode 组件：

但qrcodeVue总是指什么，我从来没有接触到画布本身。我错过了什么？我应该把这段ref()代码放在哪里？我也尝试过defineComponent同样的结果。感谢您提供任何线索。

（顺便说一句，我也尝试使用 npmqrcode-vue包，但它似乎不支持 Vue 3）

我正在尝试使用vue 3和vue-class-component创建一个按钮生成系统，其中预期如下：（请注意，给定的按钮数量不是静态的，这意味着它可以是 1 个或多个）

输入

这里Button是无渲染的，ButtonGroup第一个获取其所有子数据进行预处理，例如设置主按钮，然后渲染整个 shebang，结果如下：

输出

Button和类的代码ButtonGroup看起来像

现在我完全意识到，在 Vue 3 中实现这一点，访问子节点变得相当困难，但这将是我认为最简单的选择。我怎样才能让它工作？

另一种方法是Button创建<a>标签，然后ButtonGroup将主标签添加到相应的标签中，但这让我觉得更加复杂，因为我有一些其他元素在等待与按钮相同的处理，我可能会卡在某个地方再次走在路上。

假设一个 Vue 组件写成这样

这里有两个问题：

1. TS2339: Property 'something' does not exist on type 'DummyComponent'.和
2. this.something没有打字。

添加索引签名[x: string]: any;（是否有正确的方法来做到这一点，或者我是否混合了不应该混合的东西。我敢肯定很棒的 Vue 开发人员会想到这一点？

满足的正确方法是tsc什么？