Vue
Vue是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用。
指令:一种特殊的自定义行间属性。其作用就是当其表达式的值改变时相应地将某些行为应用到DOM上。在Vue中,指令一般以v-开头
常用指令:
-
v-text:填充纯文本
-
v-html:填充HTML片段
-
v-pre:填充原始信息。不解析模板语法,保持原有内容
-
v-model:一般用于表单元素input,双向数据绑定
-
v-if:分支结构
-
v-else:分支结构
-
v-else-if:分支结构
-
v-show :显示隐藏指令
-
v-for:循环结构
-
v-bind:属性绑定
-
v-on:click :绑定点击事件,简写为@click
v-if和v-show的区别:
v-if 是“真正”的条件渲染,因为它会确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建。v-if是惰性的,如果在初始渲染时条件为假,则什么也不做——直到条件第一次变为真时,才会开始渲染条件块。
v-show:不管初始条件是什么,元素总是会被渲染,并且只是简单地基于CSS进行切换。
一般来说,v-if 有更高的切换开销,而 v-show 有更高的初始渲染开销。因此,如果需要非常频繁地切换,则使用 v-show 较好;如果在运行时条件很少改变,则使用 v-if 较好。
v-module和v-bind的区别:
v-model用在表单控件上的,用于实现双向数据绑定,所以如果用在除了表单控件以外的标签是没有任何效果的。
v-bind动态绑定指令,默认情况下标签自带属性的值是固定的,在为了能够动态的给这些属性添加值,可以使用v-bind:你要动态变化的值=“表达式”。v-bind用于绑定属性和数据 ,其缩写为“ : ” 也就是‘v-bind:id’=‘:id’
Vue的生命周期方法:
从vue实例创建出来到vue实例销毁,所经历的不同阶段,会调用不同的方法。beforeCreate: function() {
},
created: function() {
//发送AJax请求,请求一些后台数据
},
beforeMount: function() {
},
mounted: function() { //一次
},
//多次调用
beforeUpdate: function() {
},
//多次调用
updated: function() {
},
//销毁之前调用
beforeDestroy: function() {
},
//已经销毁调用
destroyed: function() {
}