给定义的 ref 的值设置类型

<template>
	<el-input ref="input"></el-input>
</template>

//....
import {Ref, ref} from 'vue'
const input: Ref<HTMLElement> = ref(null)

这样写之后会导致编译报错(vuetur报错)

Type 'Ref<null>' is not assignable to type 'Ref<HTMLElement>'.
Type 'null' is not assignable to type 'HTMLElement'.Vetur(2322)

解决办法

  • . 增加null类型
const input: Ref<HTMLElement | null> = ref(null)
  • 在声明文件(*.d.ts)中定义一个类型声明
// 定义声明
declare type Nullable<T> = T | null

// 使用的地方只需要
const input: Ref<Nullable<HTMLElement>> = ref(null)
Logo

前往低代码交流专区

更多推荐