diff --git a/publish/changeLog.md b/publish/changeLog.md index 4fb19167..b6aaf6df 100644 --- a/publish/changeLog.md +++ b/publish/changeLog.md @@ -5,3 +5,8 @@ #### 优化 - 优化选择框动画效果 +- 尝试优化选我的音乐列表内容很多时多选的卡顿问题 + +#### 修复 + +- 修复列表延迟显示的Bug diff --git a/src/renderer/components/material/Checkbox.vue b/src/renderer/components/material/Checkbox.vue index c156dc27..24215c2b 100644 --- a/src/renderer/components/material/Checkbox.vue +++ b/src/renderer/components/material/Checkbox.vue @@ -3,9 +3,9 @@ div(:class="$style.checkbox") input(:type="need ? 'radio' : 'checkbox'" :class="$style.input" :id="id" :disabled="disabled" :value="value" :name="name" @change="change" v-model="bool") label(:for="id" :class="$style.content") div(v-if="indeterminate" :class="$style.container") - svg(v-show="indeterminate" version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='100%' width="100%" viewBox='0 32 448 448' space='preserve') + svg(v-show="indeterminate" :class="$style.icon" version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='100%' width="100%" viewBox='0 32 448 448' space='preserve') use(xlink:href='#icon-check-indeterminate') - svg(v-show="!indeterminate" version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='100%' width="100%" viewBox='0 0 448 512' space='preserve') + svg(v-show="!indeterminate" :class="$style.icon" version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='100%' width="100%" viewBox='0 0 448 512' space='preserve') use(xlink:href='#icon-check-true') div(v-else :class="$style.container") svg(version='1.1' :class="$style.icon" xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='100%' width="100%" viewBox='0 32 448 448' space='preserve') @@ -73,9 +73,9 @@ export default { let bool = this.bool if (this.indeterminate) { bool = true - this.$nextTick(() => { - this.bool = true - }) + // this.$nextTick(() => { + this.bool = true + // }) } checked = bool } diff --git a/src/renderer/utils/index.js b/src/renderer/utils/index.js index 094f6bf7..08c155e6 100644 --- a/src/renderer/utils/index.js +++ b/src/renderer/utils/index.js @@ -303,3 +303,37 @@ export const throttle = (fn, delay = 100) => { }, delay) } } + +const async_removeItem = (arr, num, callback) => window.requestAnimationFrame(() => { + let len = arr.length + if (len > num) { + arr.splice(0, num) + return async_removeItem(arr, num, callback) + } else { + arr.splice(0, len) + return callback() + } +}) +const async_addItem = (arr, newArr, num, callback) => window.requestAnimationFrame(() => { + let len = newArr.length + if (len > num) { + arr.push(...newArr.splice(0, num)) + return async_addItem(arr, newArr, num, callback) + } else { + arr.push(...newArr.splice(0, len)) + return callback() + } +}) +/** + * 异步设置数组 + * @param {*} from 原数组 + * @param {*} to 设置后的数组内容 + * @param {*} num 每次设置的个数 + */ +export const asyncSetArray = (from, to, num = 100) => new Promise(resolve => { + async_removeItem(from, num, () => { + async_addItem(from, Array.from(to), num, () => { + resolve() + }) + }) +}) diff --git a/src/renderer/views/List.vue b/src/renderer/views/List.vue index 9cdf7f28..1f7a264b 100644 --- a/src/renderer/views/List.vue +++ b/src/renderer/views/List.vue @@ -47,7 +47,7 @@