Skip to content

Vue3: devtools does not show non-default initialized component properties  #533

@nicolidin

Description

@nicolidin

Hello,

If a component has two properties, where one is default initialized and the other is initialized in the created() hook:

<template>
  <div>TESTTT</div>
</template>

<script lang="ts">
import { Vue, Options, Prop } from "vue-property-decorator";

@Options({
  name: "Test",
  components: {},
})
export default class Test extends Vue {
  first = 1;
  second!: number;

  created() {
    this.second = 1;
  }
}
</script>

The vue-devtools is not able to detect the properties that are not directly default initialized...
As we can see on the screen below:
image
Only the first property appear in the setup part but not second.

This is an important problem, a lot of our properties can't be directly initialized, and adding a default value like null is not often desirable.
Hope someone can solve this issue @posva @ktsn

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions