HelloGithub/hellogithub-vue
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

更新页面

Browse Source
This commit is contained in:
Zhang HaoYang
2023-07-07 11:33:05 +08:00
parent 090136039e
commit 6ab7a22865
2 changed files with 40 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
src/components/Monthly/MonthlyDetail.vue
View File

@@ -129,16 +129,17 @@ export default {
},
mounted() {
window.addEventListener('scroll', this.onScroll);
window.addEventListener('scroll', this.scrollToTop);
this.initPage();
this.getMonely();
this.initPage();
this.FreshItems();
// window.addEventListener('scroll',this.scrollToTop);
window.addEventListener('scroll',this.onScroll);
},
destroy() {
// 必须移除监听器，不然当该vue组件被销毁了，监听器还在就会出错
window.removeEventListener('scroll', this.onScroll);
window.removeEventListener('scroll', this.scrollToTop);
window.removeEventListener('scroll', this.onScroll);
},
computed:{
noMore() {
@@ -156,27 +157,35 @@ export default {
},
methods: {
backTop () {
const that = this
let timer = setInterval(() => {
let ispeed = Math.floor(-that.scrollTop / 5)
document.documentElement.scrollTop = document.body.scrollTop = that.scrollTop + ispeed
if (that.scrollTop === 0) {
clearInterval(timer)
let top = document.documentElement.scrollTop || document.body.scrollTop;
// 实现滚动效果
const timeTop = setInterval(() => {
document.body.scrollTop = document.documentElement.scrollTop = top -= 50;
if (top <= 0) {
clearInterval(timeTop);
}
}, 16)
},
}, 10);
// 为了计算距离顶部的高度，当高度大于60显示回顶部图标，小于60则隐藏
scrollToTop () {
const that = this
let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop
that.scrollTop = scrollTop
if (that.scrollTop > 60) {
that.btnFlag = true
} else {
that.btnFlag = false
}
// const that = this
// let timer = setInterval(() => {
// let ispeed = Math.floor(-that.scrollTop / 5)
// document.documentElement.scrollTop = document.body.scrollTop = that.scrollTop + ispeed
// if (that.scrollTop === 0) {
// clearInterval(timer)
// }
// }, 16)
},
// // 为了计算距离顶部的高度，当高度大于60显示回顶部图标，小于60则隐藏
// scrollToTop () {
// const that = this
// let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop
// that.scrollTop = scrollTop
// if (that.scrollTop > 60) {
// that.btnFlag = true
// } else {
// that.btnFlag = false
// }
// },
//滚动
// 点击切换锚点：
goAnchor(id) {
@@ -265,6 +274,7 @@ export default {
that.MonType.push(key);
that.MonTypePro.push(that.MonList[key]);
})
console.log(that.MonList);
})
},
// 月刊详情页面跳转

12
src/components/Ranking/Ranking.vue
View File

@@ -3,10 +3,10 @@
<div style="display: flex;flex-direction:column;flex-wrap: nowrap">
<div class="PageHeader">
<br/>
<el-page-header @back="goBack" style="justify-content: center;">
<el-page-header @back="goBack" style="justify-content:left;display: flex;">
<div slot="title" style="font-size:23px;font-weight: 600;"></div>
<div slot="content" style="font-size:23px;font-weight: 600;">
HelloGitHub (2023)年语言排行榜
<div slot="content" class="test" style="font-size:23px;font-weight: 600;">
<div>(2023)年(1)季度语言排行榜</div>
</div>
</el-page-header>
</div>
@@ -91,8 +91,12 @@ export default {
<style scoped lang="scss">
::v-deep .el-page-header__left{
left:-150px;
left:10px;
}
::v-deep .el-page-header__content{
flex:1;
}
.el-card{
border: none;
}