优化slide
This commit is contained in:
zyronon
parent
996401128c
commit
e71083a019
@ -14449,7 +14449,7 @@ export default {
|
||||
"avatar": new URL('../../assets/img/icon/avatar/1.png', import.meta.url).href,
|
||||
"name": "何以为家",
|
||||
"sex": "",
|
||||
"age": null,
|
||||
"age": 25,
|
||||
"idCard": null,
|
||||
"phone": "",
|
||||
"address": null,
|
||||
@ -14468,7 +14468,7 @@ export default {
|
||||
"avatar": new URL('../../assets/img/icon/avatar/19.png', import.meta.url).href,
|
||||
"name": "浅唱↘我们的歌",
|
||||
"sex": "",
|
||||
"age": null,
|
||||
"age": 25,
|
||||
"idCard": null,
|
||||
"phone": "",
|
||||
"address": null,
|
||||
@ -14487,7 +14487,7 @@ export default {
|
||||
"avatar": new URL('../../assets/img/icon/avatar/25.png', import.meta.url).href,
|
||||
"name": "‘心’之天空",
|
||||
"sex": "",
|
||||
"age": null,
|
||||
"age": 25,
|
||||
"idCard": null,
|
||||
"phone": "",
|
||||
"address": null,
|
||||
@ -14506,7 +14506,7 @@ export default {
|
||||
"avatar": new URL('../../assets/img/icon/avatar/18.png', import.meta.url).href,
|
||||
"name": "◇、_保持微笑ゞ",
|
||||
"sex": "",
|
||||
"age": null,
|
||||
"age": 25,
|
||||
"idCard": null,
|
||||
"phone": "",
|
||||
"address": null,
|
||||
@ -14525,7 +14525,7 @@ export default {
|
||||
"avatar": new URL('../../assets/img/icon/avatar/26.png', import.meta.url).href,
|
||||
"name": "好◇°我会Yi直在●",
|
||||
"sex": "",
|
||||
"age": null,
|
||||
"age": 25,
|
||||
"idCard": null,
|
||||
"phone": "",
|
||||
"address": null,
|
||||
@ -14543,7 +14543,7 @@ export default {
|
||||
"avatar": new URL('../../assets/img/icon/avatar/4.png', import.meta.url).href,
|
||||
"name": "甫韦茹",
|
||||
"sex": "",
|
||||
"age": null,
|
||||
"age": 25,
|
||||
"idCard": null,
|
||||
"phone": "",
|
||||
"address": null,
|
||||
@ -14561,7 +14561,7 @@ export default {
|
||||
"avatar": new URL('../../assets/img/icon/avatar/12.png', import.meta.url).href,
|
||||
"name": "幸福泡泡",
|
||||
"sex": "",
|
||||
"age": null,
|
||||
"age": 25,
|
||||
"idCard": null,
|
||||
"phone": "",
|
||||
"address": null,
|
||||
@ -14579,7 +14579,7 @@ export default {
|
||||
"avatar": new URL('../../assets/img/icon/avatar/3.png', import.meta.url).href,
|
||||
"name": "蔡傲安",
|
||||
"sex": "",
|
||||
"age": null,
|
||||
"age": 25,
|
||||
"idCard": null,
|
||||
"phone": "",
|
||||
"address": null,
|
||||
@ -14597,7 +14597,7 @@ export default {
|
||||
"avatar": new URL('../../assets/img/icon/avatar/16.png', import.meta.url).href,
|
||||
"name": "心若向阳无谓伤悲",
|
||||
"sex": "",
|
||||
"age": null,
|
||||
"age": 25,
|
||||
"idCard": null,
|
||||
"phone": "",
|
||||
"address": null,
|
||||
@ -14615,7 +14615,7 @@ export default {
|
||||
"avatar": new URL('../../assets/img/icon/avatar/10.png', import.meta.url).href,
|
||||
"name": "A倒影着稚嫩的少年",
|
||||
"sex": "",
|
||||
"age": null,
|
||||
"age": 25,
|
||||
"idCard": null,
|
||||
"phone": "",
|
||||
"address": null,
|
||||
@ -14633,7 +14633,7 @@ export default {
|
||||
"avatar": new URL('../../assets/img/icon/avatar/22.png', import.meta.url).href,
|
||||
"name": "一只喵的旅行。",
|
||||
"sex": "",
|
||||
"age": null,
|
||||
"age": 25,
|
||||
"idCard": null,
|
||||
"phone": "",
|
||||
"address": null,
|
||||
@ -14651,7 +14651,7 @@ export default {
|
||||
"avatar": new URL('../../assets/img/icon/avatar/14.png', import.meta.url).href,
|
||||
"name": "℉阳光下的小情绪",
|
||||
"sex": "",
|
||||
"age": null,
|
||||
"age": 25,
|
||||
"idCard": null,
|
||||
"phone": "",
|
||||
"address": null,
|
||||
@ -14669,7 +14669,7 @@ export default {
|
||||
"avatar": new URL('../../assets/img/icon/avatar/11.png', import.meta.url).href,
|
||||
"name": "思念一直在",
|
||||
"sex": "",
|
||||
"age": null,
|
||||
"age": 25,
|
||||
"idCard": null,
|
||||
"phone": "",
|
||||
"address": null,
|
||||
@ -14687,7 +14687,7 @@ export default {
|
||||
"avatar": new URL('../../assets/img/icon/avatar/9.png', import.meta.url).href,
|
||||
"name": "阎韶丽",
|
||||
"sex": "",
|
||||
"age": null,
|
||||
"age": 25,
|
||||
"idCard": null,
|
||||
"phone": "",
|
||||
"address": null,
|
||||
@ -14705,7 +14705,7 @@ export default {
|
||||
"avatar": new URL('../../assets/img/icon/avatar/5.png', import.meta.url).href,
|
||||
"name": "马佳婉清",
|
||||
"sex": "",
|
||||
"age": null,
|
||||
"age": 25,
|
||||
"idCard": null,
|
||||
"phone": "",
|
||||
"address": null,
|
||||
@ -14723,7 +14723,7 @@ export default {
|
||||
"avatar": new URL('../../assets/img/icon/avatar/0.png', import.meta.url).href,
|
||||
"name": "倒影着稚嫩的少年",
|
||||
"sex": "",
|
||||
"age": null,
|
||||
"age": 25,
|
||||
"idCard": null,
|
||||
"phone": "",
|
||||
"address": null,
|
||||
@ -14741,7 +14741,7 @@ export default {
|
||||
"avatar": new URL('../../assets/img/icon/avatar/8.png', import.meta.url).href,
|
||||
"name": "买易槐",
|
||||
"sex": "",
|
||||
"age": null,
|
||||
"age": 25,
|
||||
"idCard": null,
|
||||
"phone": "",
|
||||
"address": null,
|
||||
@ -14759,7 +14759,7 @@ export default {
|
||||
"avatar": new URL('../../assets/img/icon/avatar/7.png', import.meta.url).href,
|
||||
"name": "章昊苍",
|
||||
"sex": "",
|
||||
"age": null,
|
||||
"age": 25,
|
||||
"idCard": null,
|
||||
"phone": "",
|
||||
"address": null,
|
||||
@ -14777,7 +14777,7 @@ export default {
|
||||
"avatar": new URL('../../assets/img/icon/avatar/2.png', import.meta.url).href,
|
||||
"name": "凌依晨",
|
||||
"sex": "",
|
||||
"age": null,
|
||||
"age": 25,
|
||||
"idCard": null,
|
||||
"phone": "",
|
||||
"address": null,
|
||||
@ -14795,7 +14795,7 @@ export default {
|
||||
"avatar": new URL('../../assets/img/icon/avatar/23.png', import.meta.url).href,
|
||||
"name": "为你锁住心",
|
||||
"sex": "",
|
||||
"age": null,
|
||||
"age": 25,
|
||||
"idCard": null,
|
||||
"phone": "",
|
||||
"address": null,
|
||||
@ -14813,7 +14813,7 @@ export default {
|
||||
"avatar": new URL('../../assets/img/icon/avatar/13.png', import.meta.url).href,
|
||||
"name": "原味青春",
|
||||
"sex": "",
|
||||
"age": null,
|
||||
"age": 25,
|
||||
"idCard": null,
|
||||
"phone": "",
|
||||
"address": null,
|
||||
@ -14831,7 +14831,7 @@ export default {
|
||||
"avatar": new URL('../../assets/img/icon/avatar/24.png', import.meta.url).href,
|
||||
"name": "一起走过的日子°",
|
||||
"sex": "",
|
||||
"age": null,
|
||||
"age": 25,
|
||||
"idCard": null,
|
||||
"phone": "",
|
||||
"address": null,
|
||||
@ -14849,7 +14849,7 @@ export default {
|
||||
"avatar": new URL('../../assets/img/icon/avatar/15.png', import.meta.url).href,
|
||||
"name": "看，熟悉旳风景",
|
||||
"sex": "",
|
||||
"age": null,
|
||||
"age": 25,
|
||||
"idCard": null,
|
||||
"phone": "",
|
||||
"address": null,
|
||||
@ -14867,7 +14867,7 @@ export default {
|
||||
"avatar": new URL('../../assets/img/icon/avatar/20.png', import.meta.url).href,
|
||||
"name": "dear°学会微笑",
|
||||
"sex": "",
|
||||
"age": null,
|
||||
"age": 25,
|
||||
"idCard": null,
|
||||
"phone": "",
|
||||
"address": null,
|
||||
@ -14885,7 +14885,7 @@ export default {
|
||||
"avatar": new URL('../../assets/img/icon/avatar/6.png', import.meta.url).href,
|
||||
"name": "富察昕昕",
|
||||
"sex": "",
|
||||
"age": null,
|
||||
"age": 25,
|
||||
"idCard": null,
|
||||
"phone": "",
|
||||
"address": null,
|
||||
@ -14903,7 +14903,7 @@ export default {
|
||||
"avatar": new URL('../../assets/img/icon/avatar/17.png', import.meta.url).href,
|
||||
"name": "蓝天下的迷彩?",
|
||||
"sex": "",
|
||||
"age": null,
|
||||
"age": 25,
|
||||
"idCard": null,
|
||||
"phone": "",
|
||||
"address": null,
|
||||
@ -14921,7 +14921,7 @@ export default {
|
||||
"avatar": new URL('../../assets/img/icon/avatar/21.png', import.meta.url).href,
|
||||
"name": "伱的微笑",
|
||||
"sex": "",
|
||||
"age": null,
|
||||
"age": 25,
|
||||
"idCard": null,
|
||||
"phone": "",
|
||||
"address": null,
|
||||
@ -14941,7 +14941,7 @@ export default {
|
||||
"avatar": new URL('../../assets/img/icon/avatar/26.png', import.meta.url).href,
|
||||
"name": "好◇°我会Yi直在●",
|
||||
"sex": "",
|
||||
"age": null,
|
||||
"age": 25,
|
||||
"idCard": null,
|
||||
"phone": "",
|
||||
"address": null,
|
||||
@ -14959,7 +14959,7 @@ export default {
|
||||
"avatar": new URL('../../assets/img/icon/avatar/22.png', import.meta.url).href,
|
||||
"name": "一只喵的旅行。",
|
||||
"sex": "",
|
||||
"age": null,
|
||||
"age": 25,
|
||||
"idCard": null,
|
||||
"phone": "",
|
||||
"address": null,
|
||||
@ -14979,7 +14979,7 @@ export default {
|
||||
"avatar": new URL('../../assets/img/icon/avatar/19.png', import.meta.url).href,
|
||||
"name": "浅唱↘我们的歌",
|
||||
"sex": "",
|
||||
"age": null,
|
||||
"age": 25,
|
||||
"idCard": null,
|
||||
"phone": "",
|
||||
"address": null,
|
||||
@ -14997,7 +14997,7 @@ export default {
|
||||
"avatar": new URL('../../assets/img/icon/avatar/20.png', import.meta.url).href,
|
||||
"name": "dear°学会微笑",
|
||||
"sex": "",
|
||||
"age": null,
|
||||
"age": 25,
|
||||
"idCard": null,
|
||||
"phone": "",
|
||||
"address": null,
|
||||
|
||||
118
src/components/SlideUser.vue
Normal file
118
src/components/SlideUser.vue
Normal file
@ -0,0 +1,118 @@
|
||||
<template>
|
||||
<div id="SlideUser">
|
||||
<div class="content">
|
||||
<img class="close" src="../assets/img/icon/components/gray-close-full2.png" alt="">
|
||||
<img class="avatar" :src="user.avatar">
|
||||
<div class="name">{{ user.name }}</div>
|
||||
<div class="age">{{ user.age }}岁</div>
|
||||
<div class="realName">通讯录朋友{{ user.realName }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: "SlideUser",
|
||||
components: {},
|
||||
props: {
|
||||
modelValue: {
|
||||
type: Object,
|
||||
default() {
|
||||
return {}
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
user: {
|
||||
type: 'user',
|
||||
"id": "224e9a00-ffa0-4bc1-bb07-c318c7b02fa5",
|
||||
"avatar": new URL('../assets/img/icon/avatar/1.png', import.meta.url).href,
|
||||
"name": "何以为家",
|
||||
"realName": "王小二",
|
||||
"sex": "",
|
||||
"age": 25,
|
||||
"idCard": null,
|
||||
"phone": "",
|
||||
"address": null,
|
||||
"wechat": "",
|
||||
"password": null,
|
||||
"lastLoginTime": "1629993515",
|
||||
"createTime": "1630035089",
|
||||
"isDelete": 0,
|
||||
"account": "234",
|
||||
"pinyin": "H",
|
||||
"select": false,
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
created() {
|
||||
|
||||
},
|
||||
methods: {}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
#SlideUser {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: #e1e1e1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
.content {
|
||||
width: 85%;
|
||||
background: white;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 1.5rem;
|
||||
box-shadow: 0 0 2rem 0 #b3b3b3;
|
||||
padding: 1rem;
|
||||
color: black;
|
||||
position: relative;
|
||||
|
||||
.close {
|
||||
top: 1.5rem;
|
||||
right: 1.5rem;
|
||||
width: 2.5rem;
|
||||
height: 2.5rem;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.avatar {
|
||||
width: 12rem;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.name {
|
||||
margin-top: 2rem;
|
||||
margin-bottom: 2rem;
|
||||
font-weight: bold;
|
||||
font-size: 1.6rem;
|
||||
}
|
||||
|
||||
.age {
|
||||
font-size: 1rem;
|
||||
background: #f1f1f1;
|
||||
padding: 3px;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
.realName {
|
||||
text-align: center;
|
||||
color: gray;
|
||||
border-top: 1px solid #f1f1f1;
|
||||
border-bottom: 1px solid #f1f1f1;
|
||||
padding: 1rem 0;
|
||||
margin: 1.5rem 0;
|
||||
width: 90%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
45
src/pages/test/TestOne.vue
Normal file
45
src/pages/test/TestOne.vue
Normal file
@ -0,0 +1,45 @@
|
||||
<template>
|
||||
<div id="TestOne">
|
||||
<SlideUser class="vue"></SlideUser>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import SlideUser from "../../components/SlideUser";
|
||||
|
||||
export default {
|
||||
name: "TestOne",
|
||||
components: {
|
||||
SlideUser
|
||||
},
|
||||
props: {
|
||||
modelValue: false
|
||||
},
|
||||
data() {
|
||||
return {}
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
created() {
|
||||
},
|
||||
methods: {}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
@import "@/assets/less/index";
|
||||
|
||||
#TestOne {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
top: 0;
|
||||
overflow: auto;
|
||||
color: white;
|
||||
font-size: 1.4rem;
|
||||
|
||||
.content {
|
||||
padding-top: 6rem;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -28,6 +28,7 @@
|
||||
import Slide from "./slide";
|
||||
import Video from "../../components/Video";
|
||||
import resource from "../../assets/data/resource.js";
|
||||
import CONST_VAR from "../../utils/const_var";
|
||||
|
||||
export default {
|
||||
name: "TestSlide",
|
||||
@ -52,25 +53,62 @@ export default {
|
||||
let list = resource.videos
|
||||
list = list.concat(resource.videos)
|
||||
list.splice(24, 6)
|
||||
list = list.slice(0, 1)
|
||||
list.map(v => {
|
||||
v.type = 'video'
|
||||
})
|
||||
list.unshift({
|
||||
type: 'img',
|
||||
src: `http://douyin.ttentau.top/0.mp4?vframe/jpg/offset/0/w/${document.body.clientWidth}`
|
||||
})
|
||||
list.unshift({
|
||||
type: 'user',
|
||||
"id": "224e9a00-ffa0-4bc1-bb07-c318c7b02fa5",
|
||||
"avatar": new URL('../../assets/img/icon/avatar/1.png', import.meta.url).href,
|
||||
"name": "何以为家",
|
||||
"sex": "",
|
||||
"age": null,
|
||||
"idCard": null,
|
||||
"phone": "",
|
||||
"address": null,
|
||||
"wechat": "",
|
||||
"password": null,
|
||||
"lastLoginTime": "1629993515",
|
||||
"createTime": "1630035089",
|
||||
"isDelete": 0,
|
||||
"account": "234",
|
||||
"pinyin": "H",
|
||||
"select": false,
|
||||
})
|
||||
// list.splice(3)
|
||||
console.log('length', list.length)
|
||||
let slide = new Slide('#TestSlide1', {
|
||||
render: (item, itemIndex, play) => {
|
||||
return (
|
||||
<Video
|
||||
isPlay={play}
|
||||
video={item}
|
||||
index={itemIndex}
|
||||
onShowComments={e => this.isCommenting = true}
|
||||
onShowShare={e => this.isSharing = true}
|
||||
onGoUserInfo={e => this.baseActiveIndex = 1}
|
||||
onGoMusic={e => this.$nav('/home/music')}
|
||||
v-model={[this.videos[itemIndex], 'video']}
|
||||
/>
|
||||
)
|
||||
let html
|
||||
if (item.type === 'video') {
|
||||
html = <Video
|
||||
isPlay={play}
|
||||
video={item}
|
||||
index={itemIndex}
|
||||
onShowComments={e => this.isCommenting = true}
|
||||
onShowShare={e => this.isSharing = true}
|
||||
onGoUserInfo={e => this.baseActiveIndex = 1}
|
||||
onGoMusic={e => this.$nav('/home/music')}
|
||||
v-model={[this.videos[itemIndex], 'video']}
|
||||
/>
|
||||
}
|
||||
if (item.type === 'img') {
|
||||
html = <img src={item.src} style="height:100%;"/>
|
||||
}
|
||||
if (item.type === 'user') {
|
||||
html = <div>
|
||||
user
|
||||
</div>
|
||||
}
|
||||
return html
|
||||
},
|
||||
list,
|
||||
index: 2,
|
||||
index: 0,
|
||||
request: this.$api.videos.recommended
|
||||
})
|
||||
// let slide2 = new Slide('#TestSlide2', {
|
||||
|
||||
@ -2,6 +2,7 @@ import Dom from "../../utils/dom";
|
||||
import * as Vue from "vue";
|
||||
|
||||
export default class Slide {
|
||||
|
||||
constructor(id, config = {index: 0}) {
|
||||
this.slideList = this.create('<div class="slide-list"></div>')
|
||||
this.slideList.addEventListener('touchstart', this.touchstart.bind(this))
|
||||
@ -36,12 +37,8 @@ export default class Slide {
|
||||
this.appInsMap = new Map()
|
||||
|
||||
|
||||
if (this.config.list && this.config.list.length) {
|
||||
this.total = this.config.list.length
|
||||
this.isRecommend = false
|
||||
} else {
|
||||
this.isRecommend = true
|
||||
}
|
||||
this.isRecommend = !(this.config.list && this.config.list.length);
|
||||
|
||||
this.getData(this.pageNo)
|
||||
}
|
||||
|
||||
@ -79,11 +76,14 @@ export default class Slide {
|
||||
}
|
||||
|
||||
init() {
|
||||
//计算出正确的开始下标和结束下标
|
||||
// 情况一，数据是推荐的，默认取前面virtualTotal（5）条
|
||||
// 情况二，数据是固定的，当前要播放的视频在中间，那么取前2，后2
|
||||
// 情况二，数据是固定的，当前要播放的视频在后面，那么往前取，直到5条
|
||||
let start = 0
|
||||
let end = start + this.virtualTotal
|
||||
if (this.total > this.virtualTotal) {
|
||||
if (this.index > 1) start = this.index - 2
|
||||
else start = 0
|
||||
end = start + this.virtualTotal
|
||||
if (end > this.total) {
|
||||
start = start - (end - this.total)
|
||||
@ -95,11 +95,12 @@ export default class Slide {
|
||||
let el = this.getInsEl(v, start + i, false)
|
||||
this.slideList.appendChild(el)
|
||||
})
|
||||
this.css(this.slideList, 'transform', `translate3d(0px, ${this.getHeight()}px, 0px)`)
|
||||
|
||||
//this.total > this.virtualTotal，只有总条数在不少this.virtualTotal条数的情况下用top
|
||||
//this.index > 1 和setTop保持统一，这里其实可以用this.index > 2
|
||||
if (this.index > 1 && this.total > this.virtualTotal) {
|
||||
this.css(this.slideList, 'transform', `translate3d(0px, ${this.getHeight()}px, 0px)`)
|
||||
|
||||
this.slideList.childNodes.forEach(v => {
|
||||
//((this.total - 1 - this.index) > 1 ? 0 : 2),如果当前是最后两条，那么要多减去N个height
|
||||
console.log('((this.total - this.index) > 1 ? 0 : 2)', ((this.total - 1 - this.index) > 1 ? 0 : this.total - 1 - this.index))
|
||||
@ -132,23 +133,18 @@ export default class Slide {
|
||||
this.startLocationY = e.touches[0].pageY
|
||||
this.startTime = Date.now()
|
||||
// console.log('touchstart', this.startTime)
|
||||
|
||||
this.css(this.slideList, 'transition-duration', '0ms')
|
||||
}
|
||||
|
||||
touchmove(e) {
|
||||
this.moveXDistance = e.touches[0].pageX - this.startLocationX
|
||||
this.moveYDistance = e.touches[0].pageY - this.startLocationY
|
||||
|
||||
// console.log('touchmove', this.moveXDistance)
|
||||
// console.log('touchmove', this.moveYDistance)
|
||||
|
||||
this.isDrawDown = this.moveYDistance < 0
|
||||
|
||||
// console.log('isDrawDown', this.isDrawDown)
|
||||
|
||||
if (this.isDrawDown) {
|
||||
if (this.index === this.getList().length - 1) {
|
||||
if ( this.index === this.getList().length - 1) {
|
||||
this.css(this.slideList, 'transform', `translate3d(0px, ${this.getHeight() + (Math.abs(this.moveYDistance) > this.height / 5 ? -this.height / 5 : this.moveYDistance)}px, 0px)`)
|
||||
return
|
||||
}
|
||||
@ -160,12 +156,9 @@ export default class Slide {
|
||||
}
|
||||
|
||||
touchend() {
|
||||
if (this.isDrawDown) {
|
||||
if (this.index === this.getList().length - 1) {
|
||||
console.log('加载中')
|
||||
this.loading = true
|
||||
return
|
||||
}
|
||||
//如果向下划，并且加载中，并且还是已有数据的最后一条
|
||||
if (this.isDrawDown && this.loading && this.index === this.getList().length - 1) {
|
||||
return console.log('加载中')
|
||||
}
|
||||
|
||||
let canSlide = this.height / 8 < Math.abs(this.moveYDistance) && Math.abs(this.moveYDistance) > 40;
|
||||
@ -188,15 +181,14 @@ export default class Slide {
|
||||
}
|
||||
let res2 = this.slideList.querySelector(`.slide-item-${removeIndex}`)
|
||||
if (res2) {
|
||||
// this.appInsMap.get(removeIndex).unmount()
|
||||
this.slideList.removeChild(res2)
|
||||
}
|
||||
|
||||
|
||||
} else {
|
||||
console.log('没有新数据')
|
||||
this.getData(this.pageNo + 1, false)
|
||||
console.log('没有这条数据')
|
||||
}
|
||||
|
||||
|
||||
if (this.index + 5 > this.getList().length) {
|
||||
this.getData(this.pageNo + 1, false)
|
||||
}
|
||||
@ -215,14 +207,15 @@ export default class Slide {
|
||||
}
|
||||
let res2 = this.slideList.querySelector(`.slide-item-${removeIndex}`)
|
||||
if (res2) {
|
||||
// this.appInsMap.get(removeIndex).unmount()
|
||||
this.slideList.removeChild(res2)
|
||||
}
|
||||
}
|
||||
}
|
||||
this.setTop()
|
||||
this.setActive()
|
||||
}
|
||||
|
||||
this.setTop()
|
||||
this.setActive()
|
||||
|
||||
this.css(this.slideList, 'transition-duration', '300ms')
|
||||
this.css(this.slideList, 'transform', `translate3d(0px, ${this.getHeight()}px, 0px)`)
|
||||
|
||||
@ -72,6 +72,7 @@ import RetrievePassword from "../pages/login/RetrievePassword";
|
||||
import Help from "../pages/login/Help";
|
||||
import Uploader from "../pages/me/Uploader";
|
||||
import TestSlide from "../pages/test/TestSlide";
|
||||
import TestOne from "../pages/test/TestOne";
|
||||
|
||||
const routes = [
|
||||
// {path: '', component: Music},
|
||||
@ -82,6 +83,7 @@ const routes = [
|
||||
{path: '/test3', component: Test3},
|
||||
{path: '/test4', component: Test4},
|
||||
{path: '/test5', component: Test5},
|
||||
{path: '/testone', component: TestOne},
|
||||
{path: '/TestSlide', component: TestSlide},
|
||||
{path: '/TestVue3', component: TestVue3},
|
||||
{path: '/TestKeepAlive', component: TestKeepAlive},
|
||||
|
||||
Loading…
Reference in New Issue
Block a user