我正在使用Vue 3(3.2.45)、** typescript (4.9.4)和Vuetify(3.1.2)开发应用程序。
许多Vuetify组件要求您传递props**来指示诸如默认样式、位置或一些v模型之类的内容以显示/隐藏组件。有时候,每当我传递prop(如他们的文档中所指定的)时,编译器都会给我以下错误:Type 'boolean' is not assignable to type 'never'
Boolean只是一个例子,它只表示我试图传递给v-model的任何类型。下面的代码是一个给出错误的例子:
<template>
<div class="main-content">
<h2>Home</h2>
<v-dialog
v-model="dialog"
>
<template v-slot:activator="{ props }">
<v-btn
color="primary"
v-bind="props"
>
Open Dialog
</v-btn>
</template>
<v-card>
<v-card-text>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</v-card-text>
<v-card-actions>
<v-btn color="primary" block @click="dialog = false">Close Dialog</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
</div>
</template>
<script setup lang="ts">
import { ref } from "vue";
const dialog = ref(false);
</script>
在这种情况下,Vuetify中的v-dialog组件需要一个v模型,根据其自己的文档(https://next.vuetifyjs.com/en/api/v-dialog/),该v模型被键入为boolean。
如您所见,我在v-model上得到一个错误:
代码仍然可以工作,但是我的编译器抱怨并在我的工作区中显示带有这种“错误”的文件,这让我很困扰。
这只是发生在(到目前为止)Vuetify组件上。我自己创建和键入的组件没有显示这种行为。
我不知道是否有一种方法可以配置我的文本编辑器(vs-code)来忽略这个警告,或者我是否做错了什么触发了这个错误。
1条答案
按热度按时间zf9nrax11#
尝试像
let dialog = ref(false)
这样声明模型,并在事件期间尝试const eventDialog = () => { dialog.value = false; }