Vue3組合式API中的ref函數詳解
ref的意思是引用，reference。
用來定義常用的基礎類型(String,Number,Boolean等等)
ref() 創建的響應式數據后會返一個響應式的對象。
屬性的值需要用?.value?才能訪問到，value返回的是Proxy
將值封裝在一個對象中，看似沒有必要，但為了保持 JavaScript 中不同數據類型的行為統一，這是必須的。這是因為在 JavaScript 中，
Number?或?String?等基本類型是通過值而非引用傳遞的
使用
接受一個內部值并返回一個響應式且可變的 ref 對象，在setup函數內部訪問ref函數需要加.value， 如果要加類型，要用泛型，不加則會類型推論，也可以不給初始值，則是any，且是undefined：
const ref1 = ref(1);
const ref2 = ref<number>(2);
const ref3 = ref1.value;//不是響應式，相當于變量
const ref4 = ref();//refs.value是undefined
ref2.value = 5;//賦值 讀取都要.value一般來說，ref只會賦值基礎數據類型和數組，也可以泛型聯合類型 如果將對象分配為ref值，則它將被reactive函數處理為深層的響應式對象：
//不建議，內部也是reactive處理
const ref1 = ref({
a: 10,
});
//不確定類型
const ref3 = ref<string | number>();
ref3.value = 1;
ref3.value = "";
//數組對象，ts類型聲明，用泛型
type Obj1 = { c: string };
type Obj2 = {
b: string;
c: Obj1[];
};
const ref2 = ref<Obj2[]>([
{
b: "",
c: [{ c: "" }],
},
]);