Vueday1

vue1上课总结

MVVM

• VM是什么?
  • 答案:连接views层和model的对象

插值表达式

• 插值表达式用来干什么?
  • 答案: 1.用来输出model书写的数据
  • 2.渲染页面

语法:v-text/v-html

• v-text作用是什么?
  • 答案:v-text是用来渲染页面的和插值表达式的作用差不多,但是没有{{}}放便
  • 先说v-html是用来转义标签的,但是不要轻易使用,容易遭到黑客攻击,只是用在可信的网站上

语法:v-bind

• 问题:他是绑定给谁的?
  • 答案: 他是绑定给标签的属性上
• 用法 :v-bind:属性名 = 'data里面的属性'
• 简写:/ :属性名 = 'data里面的属性'

语法 v-for

• 问题:渲染对象三个参数 => index:对象的索引,key:对象的键,value:对象键的值
  - 渲染数组两个参数 => index:数组的索引,item:数组的值
• 用法 :循环渲染数组/对象

    
  
    
  {{item.name}}
    
  {{index}}.{{item.name}}
    
  ---------------华丽的分割线---------------
    
  {{value}}
    
   {{index}}.{{key}}:{{value}}
  
  
  
  

数组key是

• 必须要写唯一标识

语法: v-model

• 用法:数据双向绑定----model和views的值同步变化
• 注意:只能用在只能在input/textarea/select上使用

语法: v-on 指令监听dom事件

• 使用方法:
  • 1,在标签的属性位置上写上v-on:任意的事件类型=" 要执行的函数"
  • 2,简写:@任意的事件类型 = ' 执行的函数'
  • 3,通过执行函数添加参数
  • 4,通过执行函数中添加event参数传递事件对象,注意只能是event,并且不能带引号
  • 5,事件修饰符可以给事件添加特殊功能 .stop .prevent
  • 6,可以给和按键相关的事件添加按键修饰符 常用的有 .enter