vue3+ts记录

id：string|number
let a=ref<number>(4)
courseID?:string (可选参数)
let attrArr=ref<Attr[]>([])
let arr=reactive<Attr[]>([])
const fun =（a:number）=》{}


PS1：补充extends继承类型

PS2：补充枚举
 enum API{
　　DELETE_ID="/sss"
 }

PS3:el-table里面的插槽

　　<template #="{row，$index}">
　　<template>

　PS4:div和输入框相互切换：输入框失去焦点变为div，点击div，变为输入框，使用变量v-if=num   v-else控制显示谁

　PS5:复制对象（内部层级较多）注意浅拷贝问题

复制对象，object.assign（arr1,arr2），arr1获得arr2的值

const formState = reactive({ name: 'John', address: { city: 'NY' } });

const tempCopy = { ...formState }; // 浅拷贝

tempCopy.name = 'Alice'; // 安全修改

tempCopy.address.city = 'SF'; // 会修改原对象！

Object.assign()拷贝是浅拷贝，它拷贝的是属性值，假如源对象的属性值是一个对象 obj，那么拷贝的则是这个对象值的指针（也就是地址）；这个时候修改obj 的值，则目标对象会受到影响。
想要避免这种影响我们需要对对象进行深拷贝：

注意：深拷贝只能解决引用类型的值拷贝，对于继承和不可枚举属性依然不可以拷贝。

法1： let obj = Object.assign(obj2,JSON.parse(JSON.stringify(obj1)));

法2：for....in
　

 

PS6：调用封装后的接口方法

法1：注意添加async....await拿到Promise里面的内容
法2：或者直接.then
const get = async()=>{

await getUserInfo();

}

 

PS7:销毁组件前清空pina的小仓库

onBeforeUnmount(（）=>{
//清空仓库的数据
categorystore.$reset（）;
}

PS8：文件夹作用

component文件夹：全局共用抽离组件(比如封装的svg图标组件)

layout：总体布局

view：业务页面
一般文件夹：index.vue  或者  index.ts+type.ta