NCJOAQ/DogMovies
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

存档

Browse Source
This commit is contained in:
NCJOAQ
2025-11-06 10:15:38 +08:00
parent b8a9739e22
commit e9bf78f533
7 changed files with 43 additions and 68 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
index.html
View File

@@ -9,7 +9,7 @@
</head>
<body>
<div id="app" style="overflow: hidden;"></div>
<div id="app"></div>
<script type="module" src="/src/main.js"></script>
</body>

18
src/components/son.vue
View File

@@ -1,18 +0,0 @@
<template>
<div>
<h1>123</h1>
<h2>这是一个子组件{{ a }}</h2>
</div>
</template>
<script>
export default {
data() {
return {
a: 114514
}
}
}
</script>
<style scoped>
</style>

41
src/pages/home/components/MyMain.vue
View File

@@ -11,7 +11,6 @@ import BScroll from 'better-scroll'
import { nextTick } from 'vue'
import MostPopular from "@/pages/home/components/MyMostPopular.vue"
import MovieList from "@/pages/home/components/MyMovieList.vue"
import request from '@/utils'
export default {
components: {
MostPopular,
@@ -19,20 +18,24 @@ export default {
},
data() {
return {
scroll: null
scroll: null,
ids: [],
total: Infinity,
startIndex: 0,
more: []
}
},
async mounted() {
},
methods: {
async initsoc() {
async initsoc(data) {
this.startIndex = data.data.length;
await nextTick();
const el = this.$refs.main;
const box = this.$refs.box;
console.log(`滚动父元素高度：${el.offsetHeight}`)
console.log(`滚动子元素高度：${box.offsetHeight}`)
console.log(el.offsetHeight)
const el = this.$refs.main;
// console.log(`滚动父元素高度：${el.offsetHeight}`)
// console.log(`滚动子元素高度：${box.offsetHeight}`)
// console.log(el.offsetHeight)
this.total = data.total;
this.ids = data.ids;
let bs = new BScroll(el, {
// ...
pullUpLoad: true,
@@ -40,6 +43,21 @@ export default {
startY: 0,
scrollY: true
})
bs.on("pullingUp", () => {
const ids = this.ids.slice(this.startIndex, this.startIndex + length)
// console.log(this.ids, ids)
let data = fetch("http://101.35.148.193:3000/api/movies/more", {
method: "POST",
headers: {
"Content-Type": "application/json"
},
body: JSON.stringify({
ids: ids
})
})
this.more = data.data
bs.finishPullUp()
})
}
}
}
@@ -62,4 +80,5 @@ export default {
flex-direction: column;
}
}
</style>
</style>

3
src/pages/home/components/MyMostPopular.vue
View File

@@ -25,8 +25,7 @@
<script>
import BScroll from 'better-scroll'
import { nextTick } from 'vue'
import request from '@/utils';
import { watch } from 'less';
import {request} from "@/utils"
export default {
data() {
return {

16
src/pages/home/components/MyMovieList.vue
View File

@@ -1,6 +1,6 @@
<template>
<div class="movielist">
<div class="movie" v-for="movie in data" :key="movie.id">
<div class="movie" v-for="movie in checkdata" :key="movie.id">
<div class="img">
<img :src="movie.img" alt="">
</div>
@@ -14,7 +14,8 @@
<p v-if="movie.globalReleased">{{ movie.showInfo }}</p>
</div>
<div class="btn-box">
<div class="btn" :style="{ backgroundColor: movie.showStateButton.color }">{{ movie.showStateButton.content }}
<div class="btn" :style="{ backgroundColor: movie.showStateButton?.color }">{{ movie.showStateButton?.content
}}
</div>
</div>
</div>
@@ -22,7 +23,7 @@
</div>
</template>
<script>
import request from '@/utils';
import { request } from "@/utils"
import { nextTick } from 'vue';
export default {
emits: ["soc"],
@@ -33,18 +34,17 @@ export default {
},
async mounted() {
let data = await request("http://101.35.148.193:3000/api/movies/list");
console.log(data)
if (data.success) {
this.data = data.data;
this.data = data;
} else {
this.data = undefined;
}
await nextTick();
this.$emit("soc");
this.$emit("soc", this.data)
},
computed: {
checkdata() {
if (!this.data || !this.data.length) {
if (!this.data.data || !this.data.data.length) {
return [
{ nm: "啥也没有", img: "src/assets/img/1.png", globalRealse: true },
{ nm: "啥也没有", img: "src/assets/img/1.png", globalRealse: true },
@@ -52,7 +52,7 @@ export default {
{ nm: "啥也没有", img: "src/assets/img/1.png", globalRealse: false }
];
}
return this.data;
return this.data.data;
}
}
};

28
src/pages/home/index.vue
View File

@@ -9,39 +9,15 @@
import Headera from "@/pages/home/components/MyHeader.vue";
import Main from "@/pages/home/components/MyMain.vue";
import Footer from "@/pages/home/components/MyFooter.vue";
import request from "@/utils";
import { computed } from "vue";
export default {
data() {
return { rated: {}, movies: {} };
},
mounted() {
request("http://101.35.148.193:3000/api/rated/list").then((data) => {
if (data.success) {
this.rated = data.data;
} else {
this.rated = undefined;
}
});
request("http://101.35.148.193:3000/api/movies/list").then((data) => {
if (data.success) {
this.movies = data.data;
} else {
this.rated = undefined;
}
});
return {}
},
components: {
Headera,
Main,
Footer,
},
provide() {
return {
mostpopular: computed(() => this.rated),
movieList: computed(() => this.movies),
};
},
}
};
</script>
<style lang="less" scoped>

3
src/utils.js
View File

@@ -1,4 +1,3 @@
function request(url) {
export function request(url) {
return fetch(url).then((res) => res.json());
}
export default request;