-
事件绑定用@，等同于v-on查看全部
-
课程流程图
查看全部 -
子組件和父組件事件傳遞
子組件中 使用this.$emit('delete',this.index)
父組件接收處理：@delete="fatherFuncDelete"(父組件中完成處理的方法名稱)
查看全部 -
組件【components]
局部組件：
var tempdemo={
template:"<div></div>"
}
new Vue({
componets:{
'temp':tempdemo
}
})
全局組件：
Vue.component('temp',{
template:'<div></div>'
})
查看全部 -
computed:計算函數，如統計，一個屬性隨一個屬性改而改變
watch:監聽對像的屬性的變化
查看全部 -
在es6语法中，：function(){}可以简写为(){}查看全部
-
在vue脚手架中，data不再是数据，而是函数，其返回值是数据
查看全部 -
写scoped作用是只对自己组件的样式生效，否则会对全局有效
查看全部 -
data以前是对象，在这里是函数
查看全部 -
父子组件的的交互：父组件通过属性的形式传给子组件,子组件通过发布定义模式向父组件传递数据
查看全部 -
记录一下查看全部
-
v-if 如果属性为false，则直接把这个dom元素删除。
v-show 如果属性为false，则给dom元素添加display： none；
查看全部 -
<!--TodoList 功能开发<-->
<div id="root">
<div>
<input v-model="inputValue"/>
<button @click="handleSubmit">提交</button>
</div>
<ul>
<li v-for="(item, index) of list" :key="index">
{{item}}
</li>
</ul>
</div>
<script>
//计算属性
new Vue({
el:"#root",
data:{
inputValue:'',
list:[]
},
methods:{
handleSubmit:function(){
this.list.push(this.inputValue),
this.inputValue=''// 清空inputValue内容
}
}
})
</script>
查看全部 -
<div :title="title">hello world</div>双引号里面的title可以随便取名字，只需与data中的对应起来即可
<div id="root">
<div :title="aa">hello world</div>
</div>
<script>
new Vue({
el: '#root',
data: {
aa: 'this is hello world'
}
})
</script>
运行结果不变
查看全部 -
用v-if 还是v-show?
v-show更好 因为每次不会销毁dom ，在创造dom,性能会好一些
但是div标签隐藏显示频率不是那么大，只做一次显示隐藏，这个时候用v-if更合适
<!--vue 钟三个常见的指令 v-if v-show v-for 指令-->
<div id="root">
<!--v-if (控制dom存在与否)条件为 false 清除div 将元素从 DOM 中移除-->
<div v-if="show">hello world</div>
<!--v-show (控制dom的显示与否)当变量值为 false 时div 标签会被隐藏，并不会从dom 被清除 而只是把div标签属性变成了display：none-->
<!--<div v-show="show">hello world</div>-->
<buton @click="handleClick">toggle</buton>
<!--v-for 控制一组数据 来循环显示dom结构-->
v-for 能把list数组循环展示在li 有多少数据就生成多少li
适用v-for做循环展示时，需要添加:key=""，为了提高渲染效率，要求：每渲染一条的key值都是不同的
为避免数组内容重复
<ul>
<li v-for="(item, index) of list" :key="index">{{item}}</li>
</ul>
</div>
<script>
//计算属性
new Vue({
el:"#root",
data:{
show:true,
list:[1,2,3]
},
methods:{
handleClick:function(){
this.show = !this.show;
}
}
})
</script>
查看全部
举报