AJax技术

vue 学习一

字号+ 作者:H5之家 来源:H5之家 2017-10-27 12:55 我要评论( )

作为个人笔记,没有太大参考价值1.v-model表单输入绑定v-model会忽略所有表单元素的value、checked、selected特性的初始值。因为它会选择vue实例数据来作为具体

作为个人 笔记 ,没有太大参考价值

1.v-model 表单输入绑定
v-model 会忽略所有表单元素的 value、checked、selected 特性的初始值。因为它会选择 vue 实例数据来作为具体的值。你应该通过 JavaScript 在组件的 data 选项中声明初始值。
修饰符
.lazy v-model 默认在input 事件中同步值与数据 当使用.lazy 修饰符则改变为在 change 事件中同步。

<!-- 在 "change" 而不是 "input" 事件中更新 --> <input v-model.lazy="msg" >

.number
如果想自动将用户的输入值转为 Number 类型 (如果原值的转换结果为 NaN 则返回原值),可以添加一个修饰符 number 给 v-model 来处理输入值:

<input v-model.number="age" type="number">

.trim 过滤首尾空格

<input v-model.trim="msg">

v-for 列表渲染
指令根据一组数组的选项列表进行渲染。
数据是数组 (item,index)in ary
数据是对象 (item,key,index) in Object
v-show 控制显示隐藏 v-show=”true/false”;
v-on 绑定事件监听器
简写: @
参数 :event
修饰符:

.stop - 调用 event.stopPropagation()。 阻止冒泡 .prevent - 调用 event.preventDefault()。阻止默认行为 .left - (2.2.0) 只当点击鼠标左键时触发。 .right - (2.2.0) 只当点击鼠标右键时触发。 .middle - (2.2.0) 只当点击鼠标中键时触发。 .{keyCode | keyAlias} - keycode 或者 keyAlias 例如:@keyup.enter / @keyup.13 回车事件 @keyup.up/down/left/right/ 上下左右键 事件

一些事件
@contextmenu 右键
v-bind 动态绑定属性
简写: :
在绑定 class ,style 时 有一些特殊写法;
:class
1.<div :class=[h,bgColor]></div> // h是data里面的数据

data:{ h:'h'// value 里面是 style 里面定义的样式 }

2.<div :class="{h:true,bgColor:false}“> // h:是样式名称
3.<div :class="json"></div> // json 是data 里面的数据

data:{ json:{ red:true, h:false; }// red ,h 是样式表中定义的样式名称 }

:style
1.:style=”[c,b]” // c,b 是data 里面的数据
c:{color:”red”},b:{backgroundColor:’blue’}; 驼峰命名;
2. :style=”a”

data:{ a:{color:red}; }

未完

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • AJAX异步学习总结(1)

    AJAX异步学习总结(1)

    2017-10-25 13:04

  • 2017年最新PHP全套视频-学习路线图

    2017年最新PHP全套视频-学习路线图

    2017-10-15 12:06

  • ArcGIS客户端开发学习笔记(一)—AJAX机制

    ArcGIS客户端开发学习笔记(一)—AJAX机制

    2017-10-15 10:01

  • 学员笔记 千锋教育论坛

    学员笔记 千锋教育论坛

    2017-10-12 09:18

网友点评
=