首页 网络技术
  1. 正文

vue如何实现属性事件传递

属性事件传递

写过高阶组件的童鞋可能都会碰到过将加工过的属性向下传递的情况,如果碰到属性较多时,需要一个个去传递,非常不友好并且费时,有没有一次性传递的呢(比如react里面的{...this.props})?答案就是v-bind和v-on。
举个例子,假如有一个基础组件BaseList,只有基础的列表展示功能,现在我们想在这基础上增加排序功能,这个时候我们就可以创建一个高阶组件SortList。

<!-- SortList --><template><BaseList v-bind="$props" v-on="$listeners"> <!-- ... --> </BaseList></template><script>import BaseList from "./BaseList";// 包含了基础的属性定义import BaseListMixin from "./BaseListMixin";// 封装了排序的逻辑import sort from "./sort.js";export default {props: BaseListMixin.props,components: {BaseList}};</script>

可以看到传递属性和事件的方便性,而不用一个个去传递

本文标题:vue如何实现属性事件传递
本文链接:https://www.qqooo.cn/post/6931.html
版权说明:网站文章均来源于手工整理和网友投稿,若有不妥之处请来信 xsds@vip.qq.com 处理,谢谢!