Как использовать ссылку с машинописным текстом?

#typescript #vue.js #vuejs3

Вопрос:

Я пытаюсь выучить машинопись Vue3 (до сих пор я писал приложения Vue2 с помощью простого JS). Я пытаюсь определить реактивную переменную в setup() :

 setup() {
    // a single note
    interface Note {
      id: string
      creationDate: string
      text: string
      tags: string[]
      deleted: boolean
    }
    // all the notes in the app
    let allNotes: ref(Note[])  // ← this is not correct
    let allnotes: Note[]  // ← this is correct but not reactive
    
    (...)
  }
 

Каков правильный синтаксис для создания реактивного массива Note ?

Ответ №1:

Он должен быть помещен между <> :

 let allNotes= ref<Note[]>([]) 
 

по умолчанию ref выводит тип из начального значения, например

 const name=ref('') //name is a type of string
 

Ref ввод текста :

 interface Ref<T> {
  value: T
}

function ref<T>(value: T): Ref<T>
 

Ответ №2:

Нет необходимости создавать реактивный объект для того, чтобы он использовался для объекта

Как сказал @Буссаджра Брахим, добавьте тип в функцию ref следующим образом

 let reactiveNoteArray = ref<Note[]>([]); //Add this angle bracket when using custom types and interfaces