'vue method Property does not exist on type 'Readonly<...> & Vue' when accessed in component data

It's failing to see varietyFormatter, which I'm passing as a method reference for a bootstrap vue table to use.

    data() {
      return {
        tableFields: [
           {
              key: "variety",
              label: this.$t("clinic.tableHeaderType"),
              formatter: this.varietyFormatter,
              sortDirection: "asc",
              sortable: this.sortable,
            }
         ]
      }
    },
    methods: {
      varietyFormatter(value: any, key: any, item: any): string {
          if (this.fieldExists(item, key)) {
            return this.getClinicVarietyLabel(value);
          }
    
          return "-";
      }
    }


Solution 1:[1]

This was a vue2 typescript issue maybe there's a way to solve this with the file still being Vue.extends, but after I switched to class components this was resolved

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Drew Royster