--- tags: Vue 直播班 - 2022 春季班 --- # 🏅 Day 33 ###### tags: `Vue 直播班 - 2022 春季班` 題目 (請將答案貼上 CodePen) --- 操作 [這個模板](https://codepen.io/rider159159/pen/VwpbrJo),執行以下要求 (只能操作 JS 的部分): > 使用 watch 監控 props > - 請在 new-input 元件的 watch 中監控 props 傳來的值,讓下方 input 和上方 input 顯示相同數值。 > - 此次練習主要目的,是讓同學瞭解單向數據流的特性,無法直接修改 props 的值。 參考: https://ithelp.ithome.com.tw/articles/10219200 回報流程 --- 請同學依照下圖教學觀看解答、回報答案: ![](https://i.imgur.com/QtL8zEW.png) 回報格式如下圖,請在「回報區」使用註解回報答案 (為了統計人數,請同學依序加上「報數」) ![](https://i.imgur.com/L7kyew8.png) <!-- 解答 app.component('new-input', { props: ['propCash'], data() { return { cash: 0, } }, template: `<input type="number" v-model="cash"/>`, watch: { propCash() { this.cash = this.propCash; } } }); --> 回報區 --- | 報數 | 組別/名字 | codepen / 其他回饋 | |-----|------------|---------------------------------------| |01| Iris Huang | https://codepen.io/ythuang/pen/YzEEqXB | |02| 肉鬆 | https://codepen.io/klrkicog/pen/XWzzdmV | |03| Larry | https://codepen.io/larrylinr5/pen/MWOOyao?editors=1010 | |04| EmptyWu |https://codepen.io/emptywu/pen/OJOONXP | |05|Aaron Tu|https://codepen.io/aarontu/pen/MWOOybv| |06|kevinhes|https://codepen.io/kevinhes/pen/yLPPOXo?editors=1011| |07|POPEYE| https://codepen.io/popeye_ux/pen/JjOOXOw | |08|威爾|https://codepen.io/WILL_Wu/pen/dyZZMVL| |09|Jason Chen|https://codepen.io/jason60810/pen/NWwwNXd | |10|Bruno Yu|https://codepen.io/bruno-yu/pen/rNYYeJv | |11|Himi|https://codepen.io/Himi/pen/zYPPqXy| |12|Gill|https://codepen.io/Gill-Chin/pen/WNXXwgO?editors=1010| |13| KAREN HUANG | https://codepen.io/Coding_Snorlax/pen/gOXXrzP?editors=1011 | |14| Kelvin Hsu | https://codepen.io/kelvin001/pen/oNooLPY?editors=1011 | |15|kk|https://codepen.io/potatokaka/pen/RwjjRdL?editors=1010| |16|Yunei|https://codepen.io/Yunei/pen/BammLJE| |17|有廖先生(rain)|https://codepen.io/billpop741/pen/wvPPzxL| |18|Bella Shya|https://codepen.io/BellaXie/pen/wvPPoJM?editors=1010| |19|Wenfish|https://codepen.io/wenfisht/pen/YzEEGrL| |20|Henry Wu|https://codepen.io/dkcmlaww-the-flexboxer/pen/poddevX?editors=1111| |21|Calon|https://codepen.io/Calon0118/pen/RwjjpRM| |22|Tim Lin|https://codepen.io/TimmyLin/pen/rNYYymL| |23| Otis | https://codepen.io/humming74/pen/RwjjpdE?editors=1011 | |24|陳暐中|https://codepen.io/wei-z/pen/mdqqwdE?editors=1010| |25| 黃士桓 | https://codepen.io/shr-huan-huang/pen/bGYYREo?editors=1011 | |26|我是泇吟|https://codepen.io/kljuqbxs/pen/WNXXjKj| |27|tingyu| https://codepen.io/dgltu/pen/KKyyvyK?editors=1011 | |28|Arista| https://codepen.io/arista-hsieh/pen/KKyyXmW | |29|群嘉|https://codepen.io/efzdamnp-the-lessful/pen/KKyyymB| |30|咖咖|https://codepen.io/gon790219/pen/ExbboPy | |31|Rick Tzeng|https://codepen.io/rick917jp6/pen/dyZZdyq | |32|Howard|https://codepen.io/yawdnhbm/pen/OJOOQKb| |33|Benson|https://codepen.io/soul81624/pen/wvPPmWq| |34|Charlotte Lee|https://codepen.io/charlotte-lee/pen/xxPPaBP?editors=1010 | |35|CloThEs | https://codepen.io/bogwdnxx-the-sans/pen/YzEEqzB| |36|Jasper|https://codepen.io/li-jasper/pen/XWzVrPq | |37|YC|https://codepen.io/YCLu/pen/mdqpdMO | |38|Pei Ying|https://codepen.io/Pei-Ying/pen/YzEYyvG | |39|andersonshen| https://codepen.io/luxyenni-the-bold/pen/YzEYGzV | |40|Terry21|https://codepen.io/feng0409/pen/podajLL | |41|Sheep| https://codepen.io/SheepNDW/pen/MWOQzav | |42|Judy☻| https://codepen.io/hsiaohan/pen/ZEarVYV | |43|AllenW| https://codepen.io/AllenW/pen/BamYEqV?editors=1010| |44|ZY Hsu| https://codepen.io/zihyin/pen/GROxWME?editors=1010| |45|mei| https://codepen.io/Shila-Chen/pen/abVYVpK| |46|AKI|https://codepen.io/akichen27/pen/xxPWBgj | |46|Wilson|https://codepen.io/wilsonccheng/pen/NWwBoVL?editors=1010 | |47|Bonnie|https://codepen.io/bonnieli1414/pen/MWOZZRa?editors=1010 | |48|紙飛機| https://codepen.io/paperplanea/pen/XWzwJay | | 49 | sihle | https://codepen.io/bugbug777/pen/yLpLexJ | |50|Mylène|https://codepen.io/hamajibashi/pen/abENEqM| |51|大衛| https://codepen.io/exnsrpjc/pen/xxpQxzp?editors=1010 | |52|JD孟璁|https://codepen.io/oikdkmxq-the-looper/pen/bGaOqQB | |53|Gui|https://codepen.io/guitimliu/pen/abEPPrR| |54|Carol Li|https://codepen.io/carolli834/pen/KKRapPq?editors=1111|