首页 > 解决方案 > 使用“this”引用属性时,Vue 中的 Typescript 不安全成员访问错误。

问题描述

当我使用“this”引用方法部分中的属性时,出现上述错误。

我之前曾发布过此错误的更具体版本。 “对任何值的不安全成员访问”TypeScript 错误 我想我会重新发布,因为我对我定义的所有属性都收到了这个错误。

=== This is my vue file =====
<script lang="ts">
export default {
name: 'Componentname',
data () {
    return{
      message: 'initial value',
    }
}


methods: {
    samplefunction () {
        this.message = 'hello world'
    }
   
}
====================

当我运行它时,或者由于某种原因打字稿无法检测到该消息是一个字符串并在突出显示的行处给我以下错误

@typescript-eslint/no-unsafe-member-access:不安全的成员访问 .message 上的任何值。

所以我的理解是 TypeScript 从“消息:'初始值' ”中了解到它的消息是字符串类型的。事实上,当我将鼠标悬停在它上面时,它确实表明它被识别为字符串类型。如果我在任何方法中使用this.message ,无论我做什么,都会发生错误。事实上,对于我定义的所有属性,当我使用“ this.propertyname ”时,我得到了错误。令人惊讶的是,代码工作得非常好,而且我在控制台中看不到任何错误或警告。

标签: vue.jstypescript-eslint

解决方案


抱歉,如果为时已晚。

你不会错过打字吗?

data(): { message: string } {
    return {
        message: 'initial value',
    };
},

方法也是如此。

samplefunction(): void {
    this.message = 'hello world'
}

推荐阅读