vue學習總結:
引入vue:
}: 插值表示式,簡單理解用來獲取vue中定義的屬性值並渲染,可以接受乙個js表示式,但是必須有結果返回
}: 當網速較慢時,會產生插值閃爍,所以可以使用v-text和v-html來代替
v-text: 將所有資料當做字串輸出 ** 當沒有資料時,會顯示空白
v-html: 如果要輸出的資料中含有html**,會直接渲染 ** 當沒有資料時,會顯示空白
v-model: 雙向繫結,檢視中的操作會影響vue中的屬性,vue中的屬性也會影響檢視的渲染
vue應用都是從建立vue物件開始
// 物件中接受各種引數,方法
// 你要操作的元素節點
el:"元素的id",
// vue例項建立的時候,會獲取data中定義的所有屬性來渲染頁面
// 並且會見識屬性的變化,當屬性變化時,會同步渲染頁面中的屬性
// 需要注意,如果乙個屬性沒有在vue初始化的時候定義,那麼該變數的改變並不會渲染在頁面上
data: ,
// vue中自定義的方法都會在methods物件中
methods:
} // 鉤子函式: 在vue的各個生命週期中呼叫的方法
// 初始化方法
beforecreated: function(),
// 建立物件後呼叫,一般使用這個方法
created: function()
// 頁面渲染完成後要執行的方法
mounted: function()
// 銷毀例項前呼叫
beforedestroy: function()
});
Vue的基礎語法(一)
v once h2 v html url h2 data 123h2 v text message 123h2 h2 v pre h2 v cloak h2 v cloak style 動態繫結class 物件語法 class h2 class getactive h2 methods 動態繫結cl...
Vue模版基礎語法 Vue筆記 一
在vue模版中資料寫在 內,可以與vue例項data中的資料實現單向繫結,資料改變檢視改變 可為以下型別 1 js 資料 2 表示式輸出表示式執行結果 3 三元運算子運算結果 4 data中的key的vlaue 5 methods中函式執行的return返回值 data vue例項下的物件,valu...
Vue基礎語法
指令 1.1 資料繫結指令 v pre 填充原始資訊 1.顯示原始資訊跳過編譯過程 v once 只編譯一次 應用場景 顯示的資訊後續不需要修改。1.2 雙向資料繫結type text v model username 1.3 事件繫結type button v on click num type ...