Using defineComponent with options API change property and data types

This issue has been created since 2022-09-15.

Version

2.7.10

Reproduction link

https://codesandbox.io/s/vue

Steps to reproduce

The following code illustrates the problem. Changing back to the Vue.extend() API makes the error disappear.

<script lang="ts">
import Vue, { defineComponent } from 'vue';

class Foo {
  private readonly _bar: string;

  constructor(bar: string) {
    this._bar = bar;
  }
}

function process(foo: Foo) {}

// No error with the previous API
// export default Vue.extend({
export default defineComponent({
  name: 'Test',
  data() {
    return {
      foo: new Foo('none'),
    };
  },
  methods: {
    process() {
      return process(this.foo); // Argument of type '{}' is not assignable to parameter of type 'Foo'.
    },
  },
});
</script>

What is expected?

Properties and data preserve type

What is actually happening?

Error Argument of type '{}' is not assignable to parameter of type 'Foo'.


Using defineComponent in Vue 2.7 with the options API really helps migration.

Although the Vue.extend() API was reporting the correct type for classes with private members, now the defineComponent API reports an unwrapped type and causes typescript errors.

Workarounds?

  • How to handle this situation?
  • Does Vue provides a marker interface for classes with hidden state that have been constructed to be compatible with reactivity?
More Details About Repo
Owner Name vuejs
Repo Name vue
Full Name vuejs/vue
Language TypeScript
Created Date 2013-07-29
Updated Date 2022-09-27
Star Count 199644
Watcher Count 6098
Fork Count 32848
Issue Count 587

YOU MAY BE INTERESTED

Issue Title Created Date Comment Count Updated Date
Plan to update cube-helm 1 2022-08-16 2022-09-14
Using only one wheel of the hoverboard 2 2021-09-08 2022-07-16
Support for different hardware (SMART-L-V2.1, two controller boards equipped with STM32F103C8T6) 4 2021-09-08 2022-07-16
Dependabot needs permission to see 02f2e67cdd500bd4c92a6a30674f55ba 0 2021-06-01 2022-09-26
1.16.5: ERROR: JavaScript placeholders will not function! 1 2021-06-24 2022-08-20
Weather Balloon script crash 5 2022-06-11 2022-08-29
macOS: The main window does not disappear when the close button is clicked 1 2022-09-02 2022-09-23
Drop syslinux support 3 2022-04-24 2022-07-04
Can't run the image with "-p 8080:80" 5 2021-05-20 2022-08-02
Terraform Best Practices 0 2022-09-02 2022-09-06
custom macro generates type gives in typeassert, expected Symbol, got a value of type 3 2021-03-26 2022-07-26
[Broken] Roosterteeth.com Subtitles 2 2021-01-12 2022-07-25
Connect to multiple devices at the same time 26 2014-03-12 2022-09-25
[TRIGGER] Asana - Task Updated in project source (and perhaps other sources) fail to list tasks in async options 0 2022-09-16 2022-09-19
[FEATURE] Discord - integrate instant triggers with custom app/bot token 1 2022-09-15 2022-09-19
Descriptions feature in the editor is broken 1 2022-07-31 2022-09-17
Accessing Input value and .focus method 7 2017-07-24 2022-09-25
GUI版 计数错误 数据类型错误 自动回复理智无效 3 2021-04-24 2022-09-11
Segfault when filtering Arrow-backed DataFrame 1 2021-10-28 2022-09-17
Speedup model loading 5 2021-06-14 2022-09-01
TSP download no longer working? 3 2020-09-02 2022-08-31
MAINT: NS1 upgrade dependencies 2 2022-06-20 2022-09-12
Adapt smart contracts into mainnet reality 0 2020-12-02 2022-09-25
Getting some errors!! 2 2022-07-06 2022-08-26
#TE7 [TC-GENDIAG-1.1] and [TC-GENDIAG-1.2] description and verification steps are wrong. 5 2021-11-16 2022-09-17
GFM tables without leading empty lines inside list items are interpreted incorrectly as plain text 3 2021-10-05 2022-09-09
Bug Report: Unhandled exception "UnicodeDecodeError: 'utf8' codec can't decode byte 0xa3 in position 14274: invalid start byte" 2 2021-02-24 2022-08-03
App Passwords no longer exist? 3 2022-01-20 2022-09-16
Add support for monitoring MySQL/MariaDB databases 1 2022-06-22 2022-09-14
Adapter has too many deps 3 2021-02-10 2022-09-06
Can not pick-up account by my personal azure account. 5 2022-02-09 2022-09-25
Line numbers not appearing in stacktraces 4 2022-01-31 2022-09-11
Using Terraform to manage all our repos 1 2021-04-23 2022-09-25
Disabled items in choice dialogs fragments can be clicked 1 2022-04-19 2022-04-30
Add API for list Cloudant Instances 6 2021-10-20 2022-09-25
AzureDevTestLabsCreateVM returns ResourceIsNotInValidState 2 2021-04-27 2022-09-25
how to perform the sde with decreasing time 2 2022-06-05 2022-09-17
Assignments in a tabular variable list is considered part of the 'variable column' 0 2022-04-07 2022-09-05
Is this project still being actively maintained ? 1 2019-08-18 2022-09-03
Firebase Auth using setTosAndPrivacyPolicyUrls does not provide clickable links 7 2021-10-26 2022-09-25
How to set Loglevel (= silence) ? 6 2021-12-14 2022-09-07
Could a browser bundle be published alongside the module? 3 2019-07-23 2022-09-25
logical_to_mesh_axes does not process rules with repeated array dim names correctly. 0 2021-12-08 2022-09-24
Behavior of implicit coercions is inconsistent in the presence of assignments to promoted variables 1 2021-11-09 2022-09-24
System.TypeInitializationException: Type initializer 'Shadowsocks.Controller.PrivoxyRunner' threw an exception. ---> System.UnauthorizedAccessException: Access denied at path 'C:\Program Files (x86)\ss\ss_privoxy.exe'. 4 2022-07-29 2022-09-06
[BUG] time_bucket offset examples all report SQL Error with continuous aggregates 1 2022-02-21 2022-09-25
[Lens] Axis color option 3 2021-10-04 2022-07-13
can fishhook hook c function in static framework? 2 2017-07-05 2022-09-26
[Arm64 Server Throughput] Address many-core scaling challenges 13 2022-06-09 2022-09-23
Libcamera stack support (features, APIs and discussions) 47 2022-06-14 2022-09-22