vue新特性前瞻

136 阅读1分钟

潜伏在19年vueConf的交流群很久了 今日无意间发现群里大佬们已经开始做新版本vue文档的中文化翻译工作了

看来新版本已经近在咫尺了

正好有空就把官方的docs-next扒下来看看有什么好玩的新功能吧

深入组件章节

Non-Prop Attributes

我们都知道在原来组件通信之中,props单向数据流中父到子一个重头环节。 现在这个新增的非prop属性是个什么玩意呢?

根据文档加上本人的渣翻

组件的非prop属性是指传给子组件,且没有在propsemits中定义的属性和事件监听,类似idclass

大家可能会说props我知道是啥,emit不是用$去出发自定义事件的吗

别慌,这个也是个新特性,马上就会提到

属性继承

上面提到的这些非prop属性会自动受到一个继承的效果,并直接注入到一个只返回一个根组件的子组件上

这样有什么好处呢? 按照文档给出的例子就是一些html属性可以直接在父组件写入 例如change事件,可以自动绑定到子组件<select>上的原生事件,无需我们再emit进行触发了。

当然自动继承也就意味着有时候也并不需要这项功能,你可以用过手动设置inheritAttrsfalse来禁用掉。

这个场景通常是指你可能将这些属性绑定到非根元素上,

这时候你就可以通过$attrs来获取他们,再通过bind绑定了

自定义事件

现在可以通过类似propsemits属性来直接定义所有的事件了。

相对于传入的props,子组件触发的事件通过新属性就可以更清晰的展现出来。

给这个功能点个赞,不然多人协作时,找事件确实很影响效率。

既然都提到类似了,emits也就如出一辙。

既可以通过数组列举,也可以用对象形式进行验证。

对于一些复杂的项目很有必要,传值的双向验证也就齐活了。

当然,可能一些快速迭代业务的同学就会觉得徒增代码量了




更多的内容还待阅读后补充,欢迎大家指出错误

切记一切以最终发布的文档为准!

最后附上参考官方文档链接