# MVVM View <-----Binding-----> ViewModel <-------> Model ![](https://i.imgur.com/D6SARNI.png) ![](https://i.imgur.com/l0PYnYV.png) --- 資料有內容時，直接寫入到畫面中 ![](https://i.imgur.com/AEczjZe.png) --- 生命週期：在特定時間點修改文字時，只要寫在生命週期內，生命週期會調整資料，資料會直接寫在畫面(同上) ![](https://i.imgur.com/YEGUMdU.png) --- 事件觸發：觸發後更新資料，透過 v-model 的機制，畫面也會一起更新 ![](https://i.imgur.com/cwmPgWe.png) ### 參考資料＋圖片來源 - [六角 2022 Vue 直播班](https://www.hexschool.com/courses/vue-training.html) - [Vue 出一個電商網站](https://www.udemy.com/course/vue-hexschool/) ###### tags: `Vue` `六角 2022 Vue 直播班`