From 4deba40870713412c6c950f6241e094a9b059a58 Mon Sep 17 00:00:00 2001
From: 07akioni <07akioni2@gmail.com>
Date: Sat, 18 Jan 2020 13:28:20 +0800
Subject: [PATCH] perf(transfer): use many tricks to improve performance
---
.../components/transfer/enUS/basic.md | 11 +-
packages/common/Checkbox/src/Checkbox.vue | 5 +-
.../common/Checkbox/src/SimpleCheckbox.vue | 85 ++++
packages/common/Transfer/index.js | 2 +
packages/common/Transfer/src/Transfer.vue | 414 ++++++++++--------
.../common/Transfer/src/TransferButton.vue | 20 +-
.../Transfer/src/TransferHeaderCheckbox.vue | 55 +++
.../Transfer/src/TransferHeaderExtra.vue | 32 ++
.../common/Transfer/src/TransferLightBar.vue | 39 ++
.../common/Transfer/src/TransferListItem.vue | 100 -----
.../Transfer/src/TransferSourceListItem.vue | 104 +++++
.../Transfer/src/TransferTargetListItem.vue | 104 +++++
.../utils/installPropsUnsafeTransition.js | 15 +
packages/utils/validateProp.js | 11 +
styles/Transfer.scss | 95 +++-
15 files changed, 791 insertions(+), 301 deletions(-)
create mode 100644 packages/common/Checkbox/src/SimpleCheckbox.vue
create mode 100644 packages/common/Transfer/src/TransferHeaderCheckbox.vue
create mode 100644 packages/common/Transfer/src/TransferHeaderExtra.vue
create mode 100644 packages/common/Transfer/src/TransferLightBar.vue
delete mode 100644 packages/common/Transfer/src/TransferListItem.vue
create mode 100644 packages/common/Transfer/src/TransferSourceListItem.vue
create mode 100644 packages/common/Transfer/src/TransferTargetListItem.vue
create mode 100644 packages/utils/installPropsUnsafeTransition.js
create mode 100644 packages/utils/validateProp.js
diff --git a/demo/documentation/components/transfer/enUS/basic.md b/demo/documentation/components/transfer/enUS/basic.md
index fdf13e3b7..60c05b9af 100644
--- a/demo/documentation/components/transfer/enUS/basic.md
+++ b/demo/documentation/components/transfer/enUS/basic.md
@@ -11,23 +11,24 @@
{{ JSON.stringify(value) }}-
{{ $refs.transfer ? $refs.transfer._data : null }}+ ``` ```js let prefix = null function genOptions () { prefix = Math.random().toString(36).slice(2, 5) - return Array.apply(null, { length: 20 }).map((v, i) => ({ + return Array.apply(null, { length: 1000 }).map((v, i) => ({ label: prefix + 'Option' + i, value: prefix + i, - disabled: i % 3 === 0 + disabled: i % 5 === 0 })) } function genValues () { - return Array.apply(null, { length: 5 }).map((v, i) => prefix + i) + return Array.apply(null, { length: 500 }).map((v, i) => prefix + i) } export default { diff --git a/packages/common/Checkbox/src/Checkbox.vue b/packages/common/Checkbox/src/Checkbox.vue index 5fd152830..9c23dac1a 100644 --- a/packages/common/Checkbox/src/Checkbox.vue +++ b/packages/common/Checkbox/src/Checkbox.vue @@ -58,7 +58,7 @@ export default { ], model: { prop: 'checked', - event: 'input' + event: 'change' }, props: { value: { @@ -103,8 +103,7 @@ export default { if (this.NCheckboxGroup) { this.NCheckboxGroup.toggleCheckbox(!this.synthesizedChecked, this.value) } else { - this.$emit('input', !this.synthesizedChecked) - this.$emit('change', !this.synthesizedChecked, this.value) + this.$emit('change', !this.synthesizedChecked, this.synthesizedChecked) } }, handleClick (e) { diff --git a/packages/common/Checkbox/src/SimpleCheckbox.vue b/packages/common/Checkbox/src/SimpleCheckbox.vue new file mode 100644 index 000000000..8fe8d3084 --- /dev/null +++ b/packages/common/Checkbox/src/SimpleCheckbox.vue @@ -0,0 +1,85 @@ + +