优化列表滚动性能

pull/733/head
lyswhut 2021-12-23 10:37:39 +08:00
parent e337f7121b
commit 217ff27e72
5 changed files with 13 additions and 9 deletions

View File

@ -1,5 +1,5 @@
<template>
<component :is="containerEl" :class="containerClass" ref="dom_scrollContainer" style="height: 100%; overflow: auto; position: relative; display: block;">
<component :is="containerEl" :class="containerClass" ref="dom_scrollContainer" style="height: 100%; overflow: auto; position: relative; display: block; contain: strict;">
<component :is="contentEl" :class="contentClass" :style="contentStyle">
<div v-for="item in views" :key="item.key" :style="item.style">
<slot name="default" v-bind="{ item: item.item, index: item.index }" />

View File

@ -155,6 +155,7 @@ export default {
border-top: 2px solid @color-theme;
box-sizing: border-box;
display: flex;
contain: strict;
z-index: 2;
* {
box-sizing: border-box;

View File

@ -28,9 +28,10 @@ transition(enter-active-class="animated lightSpeedIn" leave-active-class="animat
p(v-if="musicInfo.album") {{$t('player__music_album')}}{{musicInfo.album}}
transition(enter-active-class="animated fadeIn" leave-active-class="animated fadeOut")
LyricPlayer(v-if="visibleLrc")
music-comment(:class="$style.comment" :musicInfo="musicInfoItem" :show="isShowPlayComment" @close="hideComment")
play-bar
LyricPlayer(v-if="visibled")
music-comment(:class="$style.comment" :musicInfo="musicInfoItem" :show="isShowPlayComment" @close="hideComment" v-if="visibled")
transition(enter-active-class="animated fadeIn" leave-active-class="animated fadeOut")
play-bar(v-if="visibled")
</template>
@ -59,7 +60,7 @@ export default {
},
setup() {
const setting = useRefGetter('setting')
const visibleLrc = ref(false)
const visibled = ref(false)
let clickTime = 0
@ -80,13 +81,13 @@ export default {
}
const handleAfterEnter = () => {
visibleLrc.value = true
visibled.value = true
}
const handleAfterLeave = () => {
setShowPlayLrcSelectContentLrc(false)
hideComment(false)
visibleLrc.value = false
visibled.value = false
}
return {
@ -100,7 +101,7 @@ export default {
hideComment,
handleAfterEnter,
handleAfterLeave,
visibleLrc,
visibled,
min() {
window.eventHub.emit(eventBaseName.min)
},
@ -137,6 +138,7 @@ export default {
color: @color-theme_2-font;
border-left: 12px solid @color-theme;
-webkit-app-region: no-drag;
contain: strict;
box-sizing: border-box;

View File

@ -204,7 +204,7 @@ export default ({ setting }) => {
const setStopStatus = () => {
setPlay(false)
setTitle()
setStatus('^-^')
setStatus('')
setStatusText('')
setMusicInfo({
songmid: null,

View File

@ -281,6 +281,7 @@ export default {
font-size: 14px;
display: flex;
flex-flow: column nowrap;
flex: auto;
&.copying {
.no-select {
display: none;