Typescript table delete by id-CodePudding

I have been using Javascript, but I have started typescript now, and want to delete data from a table. Every time I try to delete data, I get:

Property 'id' does not exist on type 'never'.

My Code:

<template #action>
    <VButton color="danger" raised @click="deleteBrand" >Delete</VButton>
  </template>

var deleteData = ref(null);

function deleteBrand() {
if(deleteData.value !== null)
directoryStore.deleteBrand(deleteData.value.id).then(() => {
  deleteModalActive.value = false;
});
}

deleteBrand(id: number): any {
  return new Promise((resolve,reject) => {
    deleteBrand(id).then(() => {
      resolve("deleted");
      this.setBrands()
    }).catch(() => {
      reject('Nor Deleted');
    })
  })
},

This is in store.

CodePudding user response：

A simple working solution is to not initialize the ref with null value,

let deleteData = ref();

or to init that ref with object schema :

let deleteData = ref({id:null});

CodePudding user response：

General points of the use of Vue with TypeScript are covered by the documentation.

Functions like ref where output type depends on input type are commonly generics and accept additional type information through generic parameters:

It is:

ref<{ id: SomeType } | null>(null);

Also deleteBrand function isn't workable; it doesn't have a parameter and doesn't return a promise.