Home » vue » Vue.js 3 What is the correct way to initialize my number variable? [duplicate]

Vue.js 3 What is the correct way to initialize my number variable? [duplicate]

Posted by: admin November 26, 2021 Leave a comment

Questions:

Using Vue 3, I’m getting the following error:

Type ‘null’ is not assignable to type ‘number’.

This is the relevant code:

interface ComponentState {
  heroSelected: number;
}

export default defineComponent({
  name: 'Battle',
  setup() {
    const state: ComponentState = reactive({
      heroSelected: null,

I also tried undefined instead of null. I do not want to initialize my variable heroSelected to 0 or any other numerical value (in which case I don’t get any error).

So what can I do to initialize it in a way that doesn’t trigger an error?

Answers:

Your interface should be defined as follows :

interface ComponentState {
  heroSelected: number | null| undefined;
}