# ==討論日期 : 5/24 ( 五 )==

## 💖 本週複習 🥰

### ==1. 請試著回答$ref會用在哪？==

#### 相關知識點
- [Vue中ref和$refs的介绍和使用方法示例](https://blog.csdn.net/qq_26780317/article/details/117930115)

#### 大家回答
- Option：$refs 綁 DOM
Composition：ref 屬性(可以用來綁DOM)、ref() 做到響應式
- [Vue Example - refs 操作 Modal (BS5) - Vue Component](https://codepen.io/Celine-510/pen/abMEOqz)
- [範例程式 - Refs](https://codepen.io/codepenplayer/pen/BaeKYXx)

<br>

### ==2. 什麼是 watch？什麼是 computed？兩者差別在哪呢?==

#### 相關知識點

#### 大家回答
- watch 可以監控一個值修改多個值
- 監聽對象改變時才會觸發
- watch 第一次不會觸發～
- computed：不會修改當前的資料，只會把資料重新計算渲染到畫面上
watch: 監聽特定值，等同於觸發一個 methods，可以修改定義的資料
- Computed 本身即代表資料，不能有重複命名的 data；Watch 則需要綁定 data。
- 一開始載入時，computed 即會被執行，watch 則不會。
- computed 可以一次監聽多個變數，watch 則一次只能監聽一個。
因此當同時有多個變數需要被監聽再產出一個結果時，computed 只要寫一次，而 watch 要寫多次（每個變數都寫一次）。
所以，在這種情況下，會選擇使用 computed。
而若只是要監聽一個變數，則可以考慮 watch。
- Watch 可以操作多個變數；Computed 最後只會返回一個值。
- [範例程式](https://codepen.io/codepenplayer/pen/MWxereE?editors=1010)
- computed 不能非同步
- computed 有 getter 跟 setter
- get 函式 (取值)：讀data資料，重新運算出結果，並渲染到畫面上
- set 函式 (寫入值)：把資料重新調整，寫回資料內
- 預設只有 get


<br>

### ==3. 可以大概介紹一下 Pinia 嗎? 有如何應用嗎?==

#### 相關知識點

#### 大家回答
- 跨很多層元件時，傳輸資料
- actions getters state

<br>

### ==4. [測驗複習](https://casper-wang.notion.site/9ad0e973288743368c1b441b198976a2)==

## 額外補充
- [Proxy](https://es6.ruanyifeng.com/#docs/proxy)
- [NVM 教學 – 如何使用 NVM 切換 node.js 版本 – nvm 基本指令](https://seanacnet.com/node-js/nvm/)
- Vite、Nuxt
- [“Rumbo 健身” APP開發經驗分享](https://kkia.medium.com/rumbo-%E5%81%A5%E8%BA%AB-app%E9%96%8B%E7%99%BC%E7%B6%93%E9%A9%97%E5%88%86%E4%BA%AB-56c787127d28)