-
methods;{}//內寫函數，例如函數名:function（）{}
v-model數據綁定
查看全部 -
屬性綁定?v-bind:+屬性?例如：v-bind:title="title" v-bind:縮寫為:
雙向綁定?v-model? input標簽既可以改變內容，也可以顯示內容
例如：v-model=""
查看全部 -
{{ }}差值表達式? v-text里的值是一個變量，他要顯示的的值是變量的值（會發生轉義）
v-html:不會轉義，如：<h1>123</h1> v-html會顯示123，v-text會顯示<h1>123</h1>
綁定事件：v-on?例如：v-on:click="",同時需要在methods下面添加相應的事件，v-on:?簡寫為@
查看全部 -
掛載點：vue只會去處理掛載點上的數據
模板：掛載點內部的內容即為模板內容，可以將模板放在vue實例里的template來編寫
實例：指定掛載點和模板就行
查看全部 -
export default {
????? data: function(){
????????????????return{
????????}
????}
}
查看全部 -
v-bind?? :
v-on??? @
查看全部 -
模板是掛載點里面的內容，也就是vue實例里面的template的內容。
查看全部 -
scoped 作用域在自己的組件中，不會影響父組件
<style scoped>
</style>
查看全部 -
v-if判斷
v-show顯示
v-for列表循環
循環格式：
1,無需用到鍵名
<li?v-for="item?of?數據數組"?:key="數據數組">鍵值</li>
?2，需鍵名操作（默認數字鍵名,鍵名為列表下標）
<li?v-for="(item,index)?of?數據數組"?:key="index">鍵值</li>
查看全部 -
computed數據計算/字符串重組
watch:j監聽事件
查看全部 -
v-model
查看全部 -
<div v-if或者v-show="show"> Hello </div>
<button @click="fn">Button</button>
<ul> <li v-for="item of list">{{item}}</li>
</ul>
data: {
show : true
list : [1, 2, 3]
},?
methods: {
fn : function(){
????this.show = !this.show;
}
}? ?v-if 和 v-show 兩者的區別：
????v-show 透過 css 里面 display：none 來設置元素隱藏，并未從DOM中刪除
????v-if 把元素從DOM中刪除掉，后面再重新添加
查看全部 -
new Vue({
????el: "",? ? (template: "",)
????data: {
????????content: "",
????????count: 0
}， computed: { fullName : function(){ return this. firstName +""+this.lastName }} 計算屬性 ，?
watch:? ?{? fullName: function() {this. count ++}},? 偵聽器
})
v-text=""? ?v-html=""? {{? }}
v-on:click="函數名"? ?簡寫 --> @click="函數名"
v-bind:(屬性) = ""? ? 簡寫 -->? :(屬性) = ""? 屬性綁定
v-model = ""? ?實現頁面和數據的雙向綁定
查看全部 -
局部樣式(scoped)
<style scoped>
//只在當前組件中有效
</style>
查看全部 -
this的指向
【this】：this.$data 或 this.$computed
查看全部
舉報