Vue2.2.0+新特性整理及注意事项
大家对vue的基本概念了解吗?不太清楚的朋友可以先熟悉下。 vue基础教程Vue.js(读音 /vjuː/,类似于 view) 是一套构建用户界面的渐进式框架。 Vue 只关注视图层, 采用自底向上增量开发的设计。 Vue 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。 本文给大家整理了vue2.2.0+新特征并详细的给大家罗列了各个版本的注意要点。这是本文重点要讲的知识,大家可以参考学习。 先附上官网: 2.2.0+版本v-for 2.2.0+ 的版本里,当在组件中使用 v-for 时, key 现在是必须的。 鼠标修饰符
这些修饰符会限制处理函数仅响应特定的鼠标按钮。 model允许一个自定义组件在使用 v-model 时定制 prop 和 event。默认情况下,一个组件上的 v-model 会把 value 用作 prop 且把 input 用作 event,但是一些输入类型比如单选框和复选框按钮可能想使用 value prop 来达到不同的目的。使用 model 选项可以回避这些情况产生的冲突。 `
// ... 上述代码相当于: { foo = val }"
value="some value">
注:checked属性要声明在props中 provide/inject这对选项需要一起使用,以允许一个祖先组件向其所有子孙后代注入一个依赖,不论组件层次有多深,并在起上下游关系成立的时间里始终生效。 2.3.0版本绑定内联样式从 2.3.0 起你可以为 style 绑定中的属性提供一个包含多个值的数组,常用于提供多个带前缀的值,例如:
这样写只会渲染数组中最后一个被浏览器支持的值。在本例中,如果浏览器支持不带浏览器前缀的 flexbox,那么就只会渲染
display: flex 。 事件修饰符Vue 还对应 addEventListener 中的 passive 选项 提供了 .passive 修饰符。 这个 .passive 修饰符尤其能够提升移动端的性能。 注:新标准中addEventListener中的第三个参数不再是true(事件捕获)fasle(事件冒泡),而是一个对象: 注:不要把 .passive 和 .prevent 一起使用,因为 .prevent 将会被忽略 v-bind修饰符 .sync (2.3.0+) 语法糖,会扩展成一个更新父组件绑定值的 v-on 侦听器 2.4.0版本v-on从 2.4.0 开始, v-on 同样支持不带参数绑定一个事件/监听器键值对的对象,如$listeners。注意当使用对象语法时,是不支持任何修饰器的。 注:v-bind在没有参数时,可以绑定到一个包含键值对的对象。其中class和style不能表示对象和数组。 2.5.0版本按键修饰符你也可直接将 KeyboardEvent.key 暴露的任意有效按键名转换为 kebab-case(短横线命名) 来作为修饰符: 有一些按键 ( .esc 以及所有的方向键) 在 IE9 中有不同的 key 值,如果你想支持 IE9,它们的内置别名应该是首选。在上面的例子中,处理函数仅在 .exact修饰符(系统修饰按键).exact 修饰符允许你控制由精确的系统修饰符组合触发的事件。 slot-scope用于将元素或组件表示为作用域插槽。特性的值应该是可以出现在函数签名的参数位置的合法的 JavaScript 表达式。这意味着在支持的环境中,你还可以在表达式中使用 ES2015 解构。它在 2.5.0+ 中替代了 scope 。 在 2.5.0+, slot-scope 不再限制在 元素上使用,而可以用在插槽内的任何元素或组件上。 总结以上所述是小编给大家介绍的Vue2.2.0+新特性整理及注意事项。编程之家 52php.cn 收集整理的教程希望能对你有所帮助,如果觉得编程之家不错,可分享给好友!感谢支持。 (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |