Ct-adc-transfers NPM

ct-adc-transfers

list-list穿梭框组件

组件示例图

在线demo

功能点

从一个集合中选出子集合

使用

从npm安装ct-adc-transfers

npm install ct-adc-transfers --save

在代码中使用

import transfer from 'ct-adc-transfers';

Vue.component(transfer.name, transfer);

或

new Vue({
    el: '#app',
    components: {
        transfer
    }
})

props

参数	说明	类型	默认值	描述
dataSource	原始数据	Array	[]	即数据集合
selectedItems	已选择的列表(右边的数据)	Array	[]	没有时请传[]，有值的情况下每一项需和dataSource中的一致(key可以少，但matchKey必须要有)
matchKey	自动匹配输入时可被匹配的key	Array	'Id'
showKey	数据列表中显示哪些key	Array	'Name'	显示在单个列表项中的key，如果key有多个,组件采用'-'进行分割内容
leftLoading	左侧列表加载状态	Boolean	false
rightLoading	右侧列表加载状态	Boolean	false
button	按钮的html内容	Object(button.toLeft / button.toRight)	左右箭头图标
leftListTitle	左侧列表的title	String	'全部列表'
rightListTitle	右侧列表中的title	String	'已选择列表'