fix bug
This commit is contained in:
parent
f0e5ea4363
commit
d70bf6738e
10
src/App.vue
10
src/App.vue
@ -130,6 +130,11 @@ const hideWins = (e) => {
|
|||||||
showSearch.value = false;
|
showSearch.value = false;
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const keyup = (e) => {
|
||||||
|
console.log(e);
|
||||||
|
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@ -152,9 +157,9 @@ const hideWins = (e) => {
|
|||||||
</div>
|
</div>
|
||||||
<div id="main">
|
<div id="main">
|
||||||
<router-view v-slot="{ Component, route }">
|
<router-view v-slot="{ Component, route }">
|
||||||
<!-- <keep-alive exclude="FM,Friends"> -->
|
<keep-alive exclude="FM,Friends">
|
||||||
<component :is="Component" />
|
<component :is="Component" />
|
||||||
<!-- </keep-alive> -->
|
</keep-alive>
|
||||||
</router-view>
|
</router-view>
|
||||||
<!-- <router-view v-slot="{ Component, route }">
|
<!-- <router-view v-slot="{ Component, route }">
|
||||||
<keep-alive v-if="route.meta.keepAlive">
|
<keep-alive v-if="route.meta.keepAlive">
|
||||||
@ -211,6 +216,7 @@ body {
|
|||||||
}
|
}
|
||||||
* {
|
* {
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
|
// scroll-behavior: smooth;
|
||||||
}
|
}
|
||||||
|
|
||||||
.top-menu {
|
.top-menu {
|
||||||
|
@ -4,7 +4,7 @@ import { useStore } from "vuex";
|
|||||||
//设置
|
//设置
|
||||||
let config = {
|
let config = {
|
||||||
elName: "mainContent", //#元素名称
|
elName: "mainContent", //#元素名称
|
||||||
log: false, //是否显示log
|
log: true, //是否显示log
|
||||||
};
|
};
|
||||||
|
|
||||||
const backSnaps = []; //返回快照数组
|
const backSnaps = []; //返回快照数组
|
||||||
@ -25,9 +25,13 @@ export function cfg(cfg){
|
|||||||
export function useBackSnaps() {
|
export function useBackSnaps() {
|
||||||
|
|
||||||
onActivated(() => {
|
onActivated(() => {
|
||||||
|
if (config.log)
|
||||||
|
console.log("useBackSnaps: onActivated事件", backSnaps);
|
||||||
restore();
|
restore();
|
||||||
});
|
});
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
|
if (config.log)
|
||||||
|
console.log("useBackSnaps: onMounted", backSnaps);
|
||||||
restore();
|
restore();
|
||||||
});
|
});
|
||||||
|
|
||||||
@ -60,10 +64,11 @@ export const saveBackSnaps = () => {
|
|||||||
//保存
|
//保存
|
||||||
if (idx > -1) {
|
if (idx > -1) {
|
||||||
const backSnap = {
|
const backSnap = {
|
||||||
idx,
|
_idx: idx,
|
||||||
scrollTop: $content ? $content.scrollTop : 0,
|
scrollTop: $content ? $content.scrollTop : 0,
|
||||||
};
|
};
|
||||||
// console.log("路由afterEach: ", backSnap);
|
if (config.log)
|
||||||
|
console.log("useBackSnaps: 保存之前",backSnap, backSnaps)
|
||||||
if (backSnaps.length < idx + 1) backSnaps.length = idx + 1;
|
if (backSnaps.length < idx + 1) backSnaps.length = idx + 1;
|
||||||
backSnaps[idx] = backSnaps[idx] ? {...backSnaps[idx], ...backSnap} : backSnap
|
backSnaps[idx] = backSnaps[idx] ? {...backSnaps[idx], ...backSnap} : backSnap
|
||||||
// backSnaps[idx] = backSnap;
|
// backSnaps[idx] = backSnap;
|
||||||
@ -81,8 +86,10 @@ export const saveSnap = (snap)=>{
|
|||||||
// url: window.location.href,
|
// url: window.location.href,
|
||||||
// };
|
// };
|
||||||
// // console.log("路由afterEach: ", backSnap);
|
// // console.log("路由afterEach: ", backSnap);
|
||||||
|
if (config.log)
|
||||||
|
console.log("useBackSnaps: 保存当前页面",snap, backSnaps);
|
||||||
if (backSnaps.length < idx + 1) backSnaps.length = idx + 1;
|
if (backSnaps.length < idx + 1) backSnaps.length = idx + 1;
|
||||||
backSnaps[idx] = backSnaps[idx] ? {...backSnaps[idx], ...{other: snap}} : {other: snap}
|
backSnaps[idx] = backSnaps[idx] ? {...backSnaps[idx], ...snap} : {...snap}
|
||||||
// backSnaps[idx] = backSnap;
|
// backSnaps[idx] = backSnap;
|
||||||
if (config.log)
|
if (config.log)
|
||||||
console.log("useBackSnaps: 保存当前页面", backSnaps);
|
console.log("useBackSnaps: 保存当前页面", backSnaps);
|
||||||
|
@ -32,9 +32,8 @@ const snap = {
|
|||||||
page: 1,
|
page: 1,
|
||||||
pageSize: 50,
|
pageSize: 50,
|
||||||
},
|
},
|
||||||
...getSnap()?.other,
|
...getSnap(),
|
||||||
};
|
};
|
||||||
console.log(snap);
|
|
||||||
|
|
||||||
const Songlist = defineAsyncComponent(() =>
|
const Songlist = defineAsyncComponent(() =>
|
||||||
import("@/components/Songlist.vue")
|
import("@/components/Songlist.vue")
|
||||||
@ -72,6 +71,7 @@ watch(
|
|||||||
() => [props.keywords, type.value, page.value, pageSize.value],
|
() => [props.keywords, type.value, page.value, pageSize.value],
|
||||||
([k, t]) => {
|
([k, t]) => {
|
||||||
keywords.value = k;
|
keywords.value = k;
|
||||||
|
// console.log('Searching...', keywords.value, type.value, page.value, pageSize.value);
|
||||||
search();
|
search();
|
||||||
}
|
}
|
||||||
// { immediate: true }
|
// { immediate: true }
|
||||||
@ -81,9 +81,14 @@ onMounted(() => {
|
|||||||
search();
|
search();
|
||||||
});
|
});
|
||||||
|
|
||||||
let firstTime = true;
|
// let firstTime = true;
|
||||||
|
// onActivated(()=>{
|
||||||
|
// console.log('actived---------');
|
||||||
|
// firstTime = true
|
||||||
|
// })
|
||||||
|
|
||||||
const search = () => {
|
const search = () => {
|
||||||
|
// console.log('Searching...', keywords.value, type.value, page.value, pageSize.value);
|
||||||
switch (type.value) {
|
switch (type.value) {
|
||||||
case 10:
|
case 10:
|
||||||
things.value = "专辑";
|
things.value = "专辑";
|
||||||
@ -147,13 +152,10 @@ const search = () => {
|
|||||||
if (page.value > maxPage) page.value = maxPage;
|
if (page.value > maxPage) page.value = maxPage;
|
||||||
if (page.value < 1) page.value = 1;
|
if (page.value < 1) page.value = 1;
|
||||||
|
|
||||||
if (firstTime) {
|
setTimeout(() => {
|
||||||
setTimeout(() => {
|
console.log(getScrollTop());
|
||||||
console.log(getScrollTop());
|
elWp.value.scrollTop = getScrollTop();
|
||||||
elWp.value.scrollTop = getScrollTop();
|
}, 50);
|
||||||
}, 100);
|
|
||||||
firstTime = false;
|
|
||||||
} else elWp.value.scrollTop = 0;
|
|
||||||
|
|
||||||
saveSnap({
|
saveSnap({
|
||||||
type: type.value,
|
type: type.value,
|
||||||
@ -194,6 +196,11 @@ const click = () => {
|
|||||||
console.log(elWp.value.scrollTop);
|
console.log(elWp.value.scrollTop);
|
||||||
window.history.pushState(null, null);
|
window.history.pushState(null, null);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const pageChange = (p) => {
|
||||||
|
page.value = p;
|
||||||
|
saveSnap({ scrollTop: 0 });
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@ -231,35 +238,50 @@ const click = () => {
|
|||||||
<span
|
<span
|
||||||
class="caption"
|
class="caption"
|
||||||
:style="selStyle('10')"
|
:style="selStyle('10')"
|
||||||
@click="type = 10;page=1;"
|
@click="
|
||||||
|
type = 10;
|
||||||
|
page = 1;
|
||||||
|
"
|
||||||
>
|
>
|
||||||
专辑
|
专辑
|
||||||
</span>
|
</span>
|
||||||
<span
|
<span
|
||||||
class="caption"
|
class="caption"
|
||||||
:style="selStyle('1000')"
|
:style="selStyle('1000')"
|
||||||
@click="type = 1000;page=1;"
|
@click="
|
||||||
|
type = 1000;
|
||||||
|
page = 1;
|
||||||
|
"
|
||||||
>
|
>
|
||||||
歌单
|
歌单
|
||||||
</span>
|
</span>
|
||||||
<span
|
<span
|
||||||
class="caption"
|
class="caption"
|
||||||
:style="selStyle('1009')"
|
:style="selStyle('1009')"
|
||||||
@click="type = 1009;page=1;"
|
@click="
|
||||||
|
type = 1009;
|
||||||
|
page = 1;
|
||||||
|
"
|
||||||
>
|
>
|
||||||
电台
|
电台
|
||||||
</span>
|
</span>
|
||||||
<span
|
<span
|
||||||
class="caption"
|
class="caption"
|
||||||
:style="selStyle('1004')"
|
:style="selStyle('1004')"
|
||||||
@click="type = 1004;page=1;"
|
@click="
|
||||||
|
type = 1004;
|
||||||
|
page = 1;
|
||||||
|
"
|
||||||
>
|
>
|
||||||
MV
|
MV
|
||||||
</span>
|
</span>
|
||||||
<span
|
<span
|
||||||
class="caption"
|
class="caption"
|
||||||
:style="selStyle('1014')"
|
:style="selStyle('1014')"
|
||||||
@click="type = 1014;page=1;"
|
@click="
|
||||||
|
type = 1014;
|
||||||
|
page = 1;
|
||||||
|
"
|
||||||
>
|
>
|
||||||
视频
|
视频
|
||||||
</span>
|
</span>
|
||||||
@ -298,9 +320,10 @@ const click = () => {
|
|||||||
<div class="panel" v-show="type == 1000"></div>
|
<div class="panel" v-show="type == 1000"></div>
|
||||||
</div>
|
</div>
|
||||||
<div class="pager">
|
<div class="pager">
|
||||||
<NPagination
|
<NPagination v-show="count>0"
|
||||||
v-model:page="page"
|
v-model:page="page"
|
||||||
:page-count="Math.ceil(count / pageSize)"
|
:page-count="Math.ceil(count / pageSize)"
|
||||||
|
:on-update:page="pageChange"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -14,7 +14,7 @@ const keywords = ref("");
|
|||||||
const elSearch = ref(null);
|
const elSearch = ref(null);
|
||||||
|
|
||||||
const search = () => {
|
const search = () => {
|
||||||
if (keywords.value.length > 0){
|
if (keywords.value.trim().length > 0){
|
||||||
pubsub.publish("zp.toggleSearch");
|
pubsub.publish("zp.toggleSearch");
|
||||||
// elSearch.value.blur()
|
// elSearch.value.blur()
|
||||||
store.commit('addSearchHistory', keywords.value)
|
store.commit('addSearchHistory', keywords.value)
|
||||||
|
@ -50,7 +50,7 @@ const keywords = ref("");
|
|||||||
const token = pubsub.subscribe("zp", (msg, data) => {
|
const token = pubsub.subscribe("zp", (msg, data) => {
|
||||||
switch (msg) {
|
switch (msg) {
|
||||||
case "zp.searchInput":
|
case "zp.searchInput":
|
||||||
keywords.value = data;
|
keywords.value = data.trim();
|
||||||
suggest(keywords.value);
|
suggest(keywords.value);
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
|
@ -211,14 +211,14 @@ export default {};
|
|||||||
align-items: center;
|
align-items: center;
|
||||||
.song-name {
|
.song-name {
|
||||||
// flex: 1;
|
// flex: 1;
|
||||||
.text-el-line-normal();
|
.text-el-line();
|
||||||
}
|
}
|
||||||
.song-author {
|
.song-author {
|
||||||
// flex: 1;
|
// flex: 1;
|
||||||
margin-left: 4px;
|
margin-left: 4px;
|
||||||
color: #aaa;
|
color: #aaa;
|
||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
.text-el-line-normal();
|
.text-el-line();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.song-time {
|
.song-time {
|
||||||
|
Loading…
x
Reference in New Issue
Block a user