feat: 优化歌词下一首的滚动

This commit is contained in:
alger
2025-01-19 13:35:10 +08:00
parent 93829acdab
commit ba95dc11fe
2 changed files with 21 additions and 3 deletions

View File

@@ -227,9 +227,21 @@ const isVisible = computed({
});
// 歌词滚动方法
const lrcScroll = (behavior: ScrollBehavior = 'smooth') => {
const lrcScroll = (behavior: ScrollBehavior = 'smooth', forceTop: boolean = false) => {
if (!isVisible.value || !lrcSider.value) return;
if (forceTop) {
lrcSider.value.scrollTo({
top: 0,
behavior
});
return;
}
if (isMouse.value) return;
const nowEl = document.querySelector(`#music-lrc-text-${nowIndex.value}`) as HTMLElement;
if (isVisible.value && !isMouse.value && nowEl && lrcSider.value) {
if (nowEl) {
const containerHeight = lrcSider.value.$el.clientHeight;
const elementTop = nowEl.offsetTop;
const scrollTop = elementTop - containerHeight / 2 + nowEl.clientHeight / 2;
@@ -479,6 +491,13 @@ onMounted(() => {
}
});
// 添加对 playMusic 的监听
watch(playMusic, () => {
nextTick(() => {
lrcScroll('instant', true);
});
});
defineExpose({
lrcScroll,
config

View File

@@ -152,7 +152,6 @@ export const getTextColors = (gradient: string = ''): ITextColors => {
if (!gradient) return defaultColors;
const colors = parseGradient(gradient);
console.log('colors', colors);
if (!colors.length) return defaultColors;
const mainColor = colors.length === 1 ? colors[0] : colors[1] || colors[0];