目錄
1.如何取到對象的第一項的鍵名
2.如何在鍵名不確定的情況下取到對象的第一項的值
3.如何獲取對象的長度?
4.計算屬性和watch監聽監聽深層數據
5.樣式穿透
1.如何取到對象的第一項的鍵名
可以通過Object.keys將對象轉化為一個包含對象所有可枚舉屬性名的數組，轉換后就可以通過索引來取到對應的鍵名。
// 訪問第一項的鍵
const issukdiv = ref(Object.keys(data.value.productValue)[0])
2.如何在鍵名不確定的情況下取到對象的第一項的值
// 訪問第一項的值
const firstKey = data.value.productValue[issukdiv.value]我們平常調用對象的某一項時都是直接打點取值，但是當鍵名不確定，是個變量時，我們就可以通過中括號來取值?，兩者有些許的區別：
- 中括號運算符總是可以替代點運算符，但點運算符不一定能全部替代中括號運算符（鍵名不確定時）
- 中括號運算符可以用字符串變量的內容作為屬性名，而點運算符卻不可以。
- 中括號運算符可以用純數字為屬性名，點運算符不能。
- 中括號運算符可以用js的關鍵字和保留字作為屬性名，點運算符不可以。
3.如何獲取對象的長度?
因為對象沒有.length屬性，但是我們可以通過object.keys獲得一個包含對象所有鍵名的數組，然后通過object.keys(obj).length來獲取鍵名數組的長度，這個長度就是對象的長度。
4.計算屬性和watch監聽監聽深層數據
watch對于引用類型，默認只能監聽第一層的變化，深層數據的變化監聽不了但是可以通過設置deep:true來開啟深度監聽。但是當深層數據被改變時，計算屬性仍然可以重新計算，無需關系數據的層次問題。
5.樣式穿透
通常我們在編寫代碼會設置樣式為scoped模式，使得該組件的樣式只在本頁面生效。但是在使用一些第三方組件的時候，通過內部類名設置樣式可能會不生效，因此使用樣式穿透，讓內部類名突破scoped的限制，從而生效。eg:
::v-deep(.van-sidebar-item) {height: 1.3333rem;width: 2.2933rem;color: #333;font-size: 0.3467rem;
}
