diff --git a/examples/docs/en-US/transfer.md b/examples/docs/en-US/transfer.md index bbc1aafd7e..90e68b32f1 100644 --- a/examples/docs/en-US/transfer.md +++ b/examples/docs/en-US/transfer.md @@ -288,3 +288,5 @@ By default, Transfer looks for `key`, `label` and `disabled` in a data item. If | Event Name | Description | Parameters | |---------- |-------- |---------- | | change | triggers when data items change in the right list | key array of current data items in the right list, transfer direction (left or right), moved item keys | +| left-check-change | triggers when end user changes the checked state of any data item in the left list | key array of currently checked items, key array of items whose checked state have changed | +| right-check-change | triggers when end user changes the checked state of any data item in the right list | key array of currently checked items, key array of items whose checked state have changed | diff --git a/examples/docs/es/transfer.md b/examples/docs/es/transfer.md index 7add2da230..994d64c6f0 100644 --- a/examples/docs/es/transfer.md +++ b/examples/docs/es/transfer.md @@ -289,4 +289,5 @@ Por defecto Transfer busca los atributos `key`, `label`, y `disabled` en cada el | Nombre | Descripcion | Parametros | | ------ | ---------------------------------------- | ---------------------------------------- | | change | se lanzá cuando los elementos cambian en la lista de la derecha | array con las claves de los elementos de la lista de la derecha | - +| left-check-change | triggers when end user changes the checked state of any data item in the left list | key array of currently checked items, key array of items whose checked state have changed | +| right-check-change | triggers when end user changes the checked state of any data item in the right list | key array of currently checked items, key array of items whose checked state have changed | diff --git a/examples/docs/zh-CN/transfer.md b/examples/docs/zh-CN/transfer.md index da5c32b402..7eedfd55f1 100644 --- a/examples/docs/zh-CN/transfer.md +++ b/examples/docs/zh-CN/transfer.md @@ -285,3 +285,5 @@ | 事件名称 | 说明 | 回调参数 | |---------- |-------- |---------- | | change | 右侧列表元素变化时触发 | 当前值、数据移动的方向('left' / 'right')、发生移动的数据 key 数组 | +| left-check-change | 左侧列表元素被用户选中 / 取消选中时触发 | 当前被选中的元素的 key 数组、选中状态发生变化的元素的 key 数组 | +| right-check-change | 右侧列表元素被用户选中 / 取消选中时触发 | 当前被选中的元素的 key 数组、选中状态发生变化的元素的 key 数组 | diff --git a/packages/transfer/src/main.vue b/packages/transfer/src/main.vue index a1a4a31421..7e8de6c035 100644 --- a/packages/transfer/src/main.vue +++ b/packages/transfer/src/main.vue @@ -167,12 +167,16 @@ }; }, - onSourceCheckedChange(val) { + onSourceCheckedChange(val, movedKeys) { this.leftChecked = val; + if (movedKeys === undefined) return; + this.$emit('left-check-change', val, movedKeys); }, - onTargetCheckedChange(val) { + onTargetCheckedChange(val, movedKeys) { this.rightChecked = val; + if (movedKeys === undefined) return; + this.$emit('right-check-change', val, movedKeys); }, addToLeft() { diff --git a/packages/transfer/src/transfer-panel.vue b/packages/transfer/src/transfer-panel.vue index 22bd5f4b84..2ae5462c11 100644 --- a/packages/transfer/src/transfer-panel.vue +++ b/packages/transfer/src/transfer-panel.vue @@ -112,14 +112,22 @@ checked: [], allChecked: false, query: '', - inputHover: false + inputHover: false, + checkChangeByUser: true }; }, watch: { - checked(val) { + checked(val, oldVal) { this.updateAllChecked(); - this.$emit('checked-change', val); + if (this.checkChangeByUser) { + const movedKeys = val.concat(oldVal) + .filter(v => val.indexOf(v) === -1 || oldVal.indexOf(v) === -1); + this.$emit('checked-change', val, movedKeys); + } else { + this.$emit('checked-change', val); + this.checkChangeByUser = true; + } }, data() { @@ -130,6 +138,7 @@ checked.push(item); } }); + this.checkChangeByUser = false; this.checked = checked; }, @@ -149,6 +158,7 @@ checked.push(item); } }); + this.checkChangeByUser = false; this.checked = checked; } }