[Vue.js]基礎筆記

 Vue 是一套用於構建用戶界面的漸進式框架。

主要學習內容參考官網連結

-------------------以下為筆記------------------------

縮寫用法

代號: v-bind 綁定參數 “href” 為變數 url，等於下面的 app.url

代號@ v-on 監聽事件 “click” 為方法 show()，等於 app.show()

ex:  

:vue = "1"      --->  v-bind:vue = "1"  

@vue = "1"      --->  v-on:vue = "1"

object.freeze()阻止響應變更變數 -->可在變數前加上$取代此用法

$前墜的符號 用於區別屬性(有實例屬性功能)

message.split('') 拆分

message.join('') 結合

v-if 與 v-show 的差異

• 使用上來說，差異在於是否有 else 的狀況。若有其他狀況，則使用v-if；否則v-if和v-show效果相同。
• 以 HTML 渲染上來說，v-if是有條件的渲染的，若條件判斷為 true 則渲染；而v-show則是無條件渲染，但視條件以 inline style css 隱藏。
• <template>可用v-if決定是否出現，但無法使用v-show。

生命週期(點我超連結)

• Vue 實例從創建到銷毀的過程，就是生命周期。從開始創建、初始化數據、編譯模板、掛載Dom→渲染、更新→渲染、銷毀等一系列過程，稱之為 Vue 的生命周期。