iview 之穿梭框 transfer

最新推荐文章于 2024-03-20 15:21:38 发布

weixin_30363981

最新推荐文章于 2024-03-20 15:21:38 发布

阅读量1.2k

点赞数

文章标签： php

原文链接：http://www.cnblogs.com/sweet-ice/p/10615780.html

版权

双栏穿梭选择框，常用于将多个项目从一边移动到另一边。

Transfer 组件主要基于以下四个 API 来使用：

:data：总体数据，数组，每项为一个对象，且必须含有 key 值，组件基于此做索引。
:target-keys：目标列索引集合，数组，每项为数据的 key 值，Transfer 会将含有这些 key 值的数据筛选到右边。（注意是 key 的集合）
:render-format：每行数据显示的格式函数，默认优先显示 label 值，没有时显示 key 值，可以自己组合出需要的数据格式。
@on-change：当点击转移按钮时，组件本身并不会转移数据，而是触发事件，由用户来操作数据。

事件名	说明	返回值
on-change	选项在两栏之间转移时的回调函数	targetKeys, direction, moveKeys
on-selected-change	选中项发生变化时触发	sourceSelectedKeys, targetSelectedKeys

转载于:https://www.cnblogs.com/sweet-ice/p/10615780.html

关注