-
v-model 雙向綁定data里面的inputValue的值
v-for 綁定data 里面的list值
定義提交方法
this.list.push(this.inputValue) 提交輸入的值到list
this.inputValue = '' 情況輸入的值
查看全部 -
v-for 表示把數(shù)據(jù)循環(huán)展示
v-for="itemxx of list" 表示取data 里面list的值,for循環(huán)每一項賦值給itemxx,循環(huán)展示的時候取值既可以用{{itemxx}}。
使用 :key="itemxx" 可以提升v-for的性能,
但注意key值要求每一項的值都不同。
可以v-for="(itemxx, ixx) of list" :key="ixx" 這樣寫表示使用第幾項作為key值,這樣保證key值的不同。
查看全部 -
v-if 表示直接添加或去掉標簽,即true添加顯示標簽,false移除銷毀標簽。
@click 表示綁定methods里面的方法
v-show 表示標簽的style 樣式添加 display:none 屬性,并沒有直接去掉標簽
查看全部 -
watch 監(jiān)聽器,表示監(jiān)聽某屬性數(shù)據(jù)發(fā)生變化時觸發(fā)
或者監(jiān)聽計算屬性的變化,如全名 fullName
??
查看全部 -
computed 計算屬性,表示通過別的屬性計算出來的。
當被計算的屬性沒有改變時,則會使用computed的緩存值。
查看全部 -
v-model 實現(xiàn)數(shù)據(jù)雙向綁定,綁定數(shù)據(jù),數(shù)據(jù)變了則其它標簽的數(shù)據(jù)也會跟著變。
查看全部 -
v-bind 標簽:表示屬性綁定。
使用v-xxx標簽等號后面接的內(nèi)容不再是字符串,而是JS表達式。
v-bind="title" title表示的是data里面的title內(nèi)容。
v-bind="'Add xxx ' + title" 表示的結(jié)果是:Add xxx 加上data里面title的內(nèi)容。
v-bind:title 可以縮寫成 :title
查看全部 -
在vue里面改變data數(shù)據(jù)定義的內(nèi)容。
當data數(shù)據(jù)內(nèi)容改變時,vue會自動刷新綁定的標簽,不需要操作document標簽。
面向數(shù)據(jù)去編程。
示例:this.content = "world" 則直接改變了data里面定義的content的值。
查看全部 -
vue語法:
v-on:click ?表示添加點擊事件。
v-on:click="handleClick" 表示添加點擊事件綁定handleClick方法
在vue的methods:{} 對象里面添加對應(yīng)的方法即可調(diào)用
?? ?
v-on:click 可以簡寫成 @click
查看全部 -
vue語法:
插值表達式-方法一:{{numxxx}}
插值表達式-方法2:使用 v-text="numxxx"
插值表達式-方法3:使用 v-html="numxxx"
v-text 與 v-html 的區(qū)別:
v-text不會轉(zhuǎn)義。
v-html會轉(zhuǎn)義內(nèi)容。
查看全部 -
vue的hello world示例:
引入vue.js源碼:在html標簽頭部使用<script src="./vue.js"></script>引入
使用vue則不需要再document.getElementById("root")這樣操作標簽。
直接使用{}掛載點方式綁定。
查看全部 -
this.$emit('delete',this.index)
查看全部 -
v-if="show"
v-if dom中刪除
v-show 隱藏
v-for 循環(huán)展示
v-for="item? of list”
查看全部 -
計算屬性:
computed:
偵聽器:
watch:
查看全部 -
?插值表達式
v-text 不會轉(zhuǎn)義
v-html 會轉(zhuǎn)義
v-on:click click標簽
v-on:簡寫為@
methods
查看全部
舉報