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向后端发送请求

 

posted @ 2020-03-01 17:51  踏月而来  阅读(64)  评论(0编辑  收藏