TS2339: 属性 'showNewCustomerFields' 不存在于类型'{ newCustomer(owner: any): void; }'答案

【问题标题】：TS2339: Property 'showNewCustomerFields' does not exist on type '{ newCustomer(owner: any): void; }'TS2339: 属性 'showNewCustomerFields' 不存在于类型'{ newCustomer(owner: any): void; }'
【发布时间】：2021-10-31 00:54:43
【问题描述】：

我是 vue 和 ionic 的新手，我无法弄清楚为什么会收到此 TS2339 错误。

任何帮助将不胜感激

  data() {
    return {
      owner: "default",
      showNewCustomerFields: false,
      newCustomerName: "",
    };
  },
  method: {
    newCustomer(owner) {
      //console.log(owner);
      if (owner === "new") {
        this.showNewCustomerFields = true;
        // console.log(showNewCustomerFields);
      } else {
        // console.log(showNewCustomerFields);
        this.showNewCustomerFields = false;
      }
    },
  },

【问题讨论】：

尝试在 ts playground 中提供最小的可重现示例

标签： typescript vue.js ionic-framework vuejs3

【解决方案1】：

来自 Vue docs：

要让 TypeScript 正确推断 Vue 组件选项中的类型，您需要使用 defineComponent 全局方法定义组件：

所以你的代码应该是这样的：

// MyComponent.vue
import {} from 'vue'

export default defineComponent({
  data() {
    return {
      owner: "default",
      showNewCustomerFields: false,
      newCustomerName: "",
    };
  },
  method: {
    newCustomer(owner) {
      if (owner === "new") {
        this.showNewCustomerFields = true;
      } else {
        this.showNewCustomerFields = false;
      }
    },
  },
})

【讨论】：