TypeScript在Vue中的使用-------ref

我们平时的写法

import { ref } from "vue";
const msg = ref("你好世界");

使用TS的写法

import { ref } from "vue";
const msg = ref<string>("你好世界");

listType表示数组里面放对象，我们可以用如下的方法进行调用

type listType = {
    id: number
    name: string
    done: boolean
}[];
const list = ref<listType>([
    { id: 1, name: "yansunda", done: false },
    { id: 2, name: "yansunda", done: false },
    { id: 3, name: "yansunda", done: false },
]);
console.log(list);

对listType的数组声明[]可以防止到<>中，这样子更加的灵活

那么将来有一个对象类型也有这个属性，我们也可以复用

type listType = {
    id: number;
    name: string;
    done: boolean;
};
const list = ref<listType[]>([
    { id: 1, name: "yansunda", done: false },
    { id: 2, name: "yansunda", done: false },
    { id: 3, name: "yansunda", done: false },
]);