-
todolist 簡單功能實(shí)現(xiàn)查看全部
-
v-for=“(index,key,value) in list”查看全部
-
v-if v-show 控制標(biāo)簽的顯示和隱藏,當(dāng)為false時,前者銷毀dom,后者隱藏dom,所以頻繁使用時推薦后者。查看全部
-
偵聽器watch 監(jiān)聽數(shù)據(jù)變化,一旦變化則調(diào)用偵聽器內(nèi)函數(shù)查看全部
-
計算屬性computed 某變量依賴其他變量而改變查看全部
-
掛載點(diǎn)、模板、實(shí)例的概念查看全部
-
v-html不會轉(zhuǎn)義,v-text會轉(zhuǎn)義 v-on:click 可以簡寫為@click methods內(nèi)為函數(shù)查看全部
-
v-bind: 是屬性綁定,將數(shù)據(jù)綁定到組件上,可以簡寫為: v-model是雙向綁定,數(shù)據(jù)和顯示可同時變化。查看全部
-
子組件自定義一個事件,傳值給父組件,父組件監(jiān)聽子組件自定義的事件對傳入的值進(jìn)行處理
查看全部 -
3-4 實(shí)現(xiàn)todolist的刪除功能
核心任務(wù):如果要刪除子組件,目的是刪除父組件中的相關(guān)數(shù)據(jù)。
在vue中,子組件向父組件傳值,是通過$emit方式: 發(fā)布訂閱模式?
查看全部 -
3-4 實(shí)現(xiàn)todolist的刪除功能
在vue中,父組件向子組件傳值,是通過屬性方式: Vue-->todo-itme??
查看全部 -
3-3 組件與實(shí)例之間的關(guān)系
每一個組件本身也是一個vue實(shí)例,一個項目是由大量的vue實(shí)例組成。
證明:
查看全部 -
3-2 todolist組件拆分
查看全部 -
3-1 todo-list功能開發(fā)
<!DOCTYPE?html><html?lang="en"><head>????<meta?charset="UTF-8">????<title>Todo</title>????<script?src="vue.js"></script></head><body>????<div?id="demo">????????<input?v-model="inputValue"?type="text"?name=""?id="">????????<button?@click="handleSubmit"?>提交</button>????????<ul>????????????<li?v-for="(item,index)?of?list"?:key="index">?{{item}}?</li>????????</ul>????</div>????<script>????????new?new?Vue({????????????el:"#demo",????????????data:?{????????????????inputValue:?"hello",????????????????list:?[]????????????},????????????methods:?{????????????????handleSubmit:?function(){????????????????????this.list.push(this.inputValue);????????????????????this.inputValue=""????????????????}????????????}????????})????</script></body></html>
查看全部 -
2-6 v-if, v-show, v-for
:key="index"提升性能
用index有時會出問題,主要是表現(xiàn)在頻繁變換順序時
查看全部
舉報