Vue入门
Vue.js 是一个提供了MVVM (Model-View-ViewModel的)风格的双向数据绑定的Javascript 库,专注于View 层。它的核心是 MVVM 中的 VM,也就是 ViewModel。让我们将视图 UI 和业务逻辑分开。
1 插值表达式
(双大括号) 的文本插值
{{message}}
2 常用系统指令
v-on:keydown 键盘按下 简写为@keydown
v-on:click 点击事件 简写为@click
v-on:mouseover 鼠标滑过 简写为@mouseover
3 事件修饰符
Vue.js通过由点(.)表示的指令后缀来调用修饰符
.stop 阻止事件传播 例如 @mouseover.stop
.prevent 阻止事件默认行为 例如 @submit.prevent
4 按键修饰符
Vue.js通过由点(.)表示的指令后缀来调用修饰符
.enter 表示按下的是回车键 例如 @keydown.enter
5 v-text和v-html和v-bind
v-html可以识别其中的标签,v-text不能识别其中的标签
v-bind 可以给html标签中属性赋值,插值表达式{{}}不能给标签中的属性赋值
v-bind:color="xxx" 简写为:color="xxx"
6 v-model
从Vue定义中的data数据中取值
7 v-for
从Vue定义中的data数据中取出数组或者对象进行遍历,遍历时都是值在前索引在后,如下
<li v-for="(value,index) in arr ">{{value}}={{index}} </li>
8 v-if和v-show
v-if是根据表达式的值来决定是否渲染元素
v-show是根据表达式的值来决定元素的display css属性
9 Vuejs对象的生命周期
Vue对象实例化中包含8个钩子方法
beforeCreate,created,beforeMount,mounted,beforeUpdate,updated,beforeDestroy,destroyed
10 vuejs中推荐使用axios向后端发送请求