練習：建立一個使用 GZ 壓縮的頁面

使用 Intl.DateTimeFormat() constructor 將日期格式化成 ISO 8601 格式

Vue.js：ref 對象更動後，要如何在 DOM 的變更結束後，執行 function

我這邊有段 vue code：

<script setup lang="ts">
interface CartItem {
	id: any;
	itemID: any;
	name: string;
	price: number;
	count: number;
}
let cartItem = ref<CartItem[]>([])


</script>
<template>
	<aside>
		<div class="cart-item" v-for="(item) in cartItem">
			<span v-text="item.name"/>
			<span v-text="'$' + item.price"/>
			<input type="number" v-model="item.count" />

		</div>
	</aside>
</template>

這段 code，每次 cartItem 新增一個項目後，就會自動建立一組 <div class="cart-item" />；反之，每刪除一個項目，就會刪掉一個<div class="cart-item" />。

我現在要的，是每新增或刪除完一個項目後，自動執行一段 function。

例如新增完畢後，自動 focus 到最新的 input 中。