Vuejs 打字稿 this.$refs.<refField>.value 不存在 [英] Vuejs typescript this.$refs.<refField>.value does not exist
本文介绍了Vuejs 打字稿 this.$refs.<refField>.value 不存在的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
在用打字稿重写我的 VueJs 项目时，我遇到了打字稿错误.
这是具有自定义 v-model 的组件的一部分.
html 中的输入字段有一个名为plate"的引用，我想访问它的值.该字段上的@input 调用下面编写的更新方法.
Typescript 抱怨盘子上不存在值.
@Prop() 值:任意；更新() {this.$emit('输入',盘子:this.$refs.plate.value});}模板:
<div><div class="form-group"><label for="inputPlate" class="col-sm-2 control-label">Plate</label><div class="col-sm-10"><input type="text" class="form-control" id="inputPlate" ref="plate" :value="value.plate" @input="update"> 解决方案
您可以这样做:
class YourComponent 扩展 Vue {$refs!: {复选框元素:HTMLFormElement}一些方法(){this.$refs.checkboxElement.checked}}来自这个问题:https://github.com/vuejs/vue-类组件/问题/94
While rewriting my VueJs project in typescript, I came across a TypeScript error.
This is a part of the component that has a custom v-model.
An input field in the html has a ref called 'plate' and I want to access the value of that. The @input on that field calls the update method written below.
Typescript is complaining that value does not exist on plate.
@Prop() value: any;
update() {
this.$emit('input',
plate: this.$refs.plate.value
});
}
template:
<template>
<div>
<div class="form-group">
<label for="inputPlate" class="col-sm-2 control-label">Plate</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="inputPlate" ref="plate" :value="value.plate" @input="update">
</div>
</div>
</div>
</template>
解决方案
You can do this:
class YourComponent extends Vue {
$refs!: {
checkboxElement: HTMLFormElement
}
someMethod () {
this.$refs.checkboxElement.checked
}
}
From this issue: https://github.com/vuejs/vue-class-component/issues/94
这篇关于Vuejs 打字稿 this.$refs.<refField>.value 不存在的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
