--- tags: Vue 直播班 - 2023 冬季班 --- # 🏅 Day 41 - $refs 生命週期陷阱 觀看完課程影音「生命週期詳解」後,了解生命週期,練習下方題目。 題目 --- 操作 [這個模板](https://codepen.io/hexschool/pen/eYLOGdx),執行以下要求 (只能操作 JS 的部分): > $refs 生命週期陷阱 > - 請試著將模板中的 created 生命週期替換為 mounted,讓 alert 警告能夠跳出。 > - 本次練習主要是讓同學理解 `created()` 、 `mounted()` 的使用時機 #### 額外挑戰 完成上述題目後,嘗試將 JS 區塊改為使用 Composition API 撰寫 ## 回報流程 將答案寫在 CodePen 並複製 CodePen 連結貼至底下回報就算完成了喔! 解答位置請參考下圖(需打開程式碼的部分觀看) ![](https://i.imgur.com/vftL5i0.png) <!-- 解答: const app = Vue.createApp({ mounted() { this.$refs.alert.callAlert(); }, }) https://codepen.io/jmimiding4104/pen/LYapLxa 額外挑戰: https://codepen.io/jmimiding4104/pen/OJqygmN?editors=1111 --> 回報區 --- | Discord | CodePen / 答案 | |:----------:|:-------------------------------------------------------:| | JING | [CodePen](https://codepen.io/HSUANIN0327/pen/poYMNXE) | | py | [CodePen](https://codepen.io/Wpypy/pen/YzgmNqg) | | Tippy | [CodePen](https://codepen.io/Ektodor-Wang/pen/VwRomxd) | | Celine 510 | [CodePen](https://codepen.io/Celine-510/pen/xxBvqMV) | | Chia Pin | [CodePen](https://codepen.io/joker-cat/pen/LYawyLz) | | Winnie | [CodePen](https://codepen.io/codepen-io-winnie/pen/ExMqXRd?editors=1010) | | kawa | [CodePen](https://codepen.io/z83xji6/pen/KKEOvvx?editors=1010) | | RayRay | [CodePen](https://codepen.io/CityRay/pen/RwdXjbd) | | Yijing | [CodePen](https://codepen.io/Yi-Jing-71080635/pen/MWxNRJP?editors=1010) | |Eden|[Codepen](https://codepen.io/iseden/pen/VwRoJBO)| |wei_Rio|[CodePen](https://codepen.io/wei_wu/pen/vYMBEbx?editors=1010)| | Eazy | [CodePen](https://codepen.io/Eazychen/pen/mdgbVbe) | | Ataraxia | [CodePen](https://codepen.io/ataraxia8888/pen/OJGLjez) | | Charlotte Lee | [CodePen](https://codepen.io/char849/pen/RwObxOp) | | PayRoom |[CodePen](https://codepen.io/water38198/pen/mdgbGLO)| | Uli | [CodePen](https://codepen.io/uli1313/pen/LYvYGEq?editors=1010) | | 貢波波夫 | [CodePen](https://codepen.io/mxgrfgcr-the-bashful/pen/abxbZqE) | | Fabio20 | [CodePen](https://codepen.io/fabio7621/pen/PogoKrj) | | Ariel | [CodePen](https://codepen.io/ariel0510/pen/BaEyQqx?editors=1010) | | Iris | [CodePen](https://codepen.io/iris831206/pen/ZEZYrmd) | | chris | [CodePen](https://codepen.io/cjtseng07/pen/ZEZGVKe) | | runweiting | [CodePen](https://codepen.io/weiting14/pen/RwOrvxX) | | yuan! | [CodePen](https://codepen.io/townyuan/pen/poBbJYP) | <!-- | user | [CodePen]() | -->
×
Sign in
Email
Password
Forgot password
or
By clicking below, you agree to our
terms of service
.
Sign in via Facebook
Sign in via Twitter
Sign in via GitHub
Sign in via Dropbox
Sign in with Wallet
Wallet (
)
Connect another wallet
New to HackMD?
Sign up