[英]TypeScript + Vue 3 - ReferenceError: variable is not defined
我在<script>
的开头声明了一个类型为any
的变量,然后我在同一个<script>
中的一个方法中引用了它。 我的 IDE 根本没有抱怨,但令人惊讶的是,我在控制台中看到了一个运行时错误: ReferenceError: flik is not defined
。
也许这与 Vue 生命周期中围绕变量实例化的竞争条件有关? 这很令人困惑,因为我在其他地方使用类似的模式没有遇到这个问题。 我下面的代码有什么问题?
<script lang="ts">
import Flickity from "./widgets/Flickity.vue";
declare var flik: any
export default defineComponent({
components: {
Flickity
},
methods: {
addElement() {
flik = this.$refs.flickity //ERROR HERE: flik is undefined
flik.append(this.makeFlickityCell())
},
makeCell() {
const cell = document.createElement('div');
cell.className = 'carousel-cell'
cell.textContent = "Hi"
return cell
}
},
mounted() {
this.addElement()
}
});
</script>
我认为这里不需要declare
,它实际上告诉 TypeScript 编译器flik
已经在其他地方声明(例如,它是全局的)。
只需将类型断言用作any
:
(this.$refs.flickity as any).append(this.makeFlickityCell())
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.