Files
ClassContent/历届学生/fontendseven/项目练习/个人练习/蔡敏/屁桃儿/js/page/index.js
2024-09-27 02:06:13 +08:00

68 lines
1.6 KiB
JavaScript

class Index {
constructor() {
this.getClass();
this.getIndex();
footer()
}
async getClass() {
var res = await server.type();
console.log(res)
res.principal.unshift({
id: null,
page: 0,
title: "首页"
})
res.principal.forEach((v,i) => {
$(".header_menu ul").innerHTML += `
<li class="${i == 0 ? 'active' : ''}">${v.title}</li>
`;
if (i > 0) {
$(".swiper-container .swiper-wrapper").innerHTML += `
<div class="swiper-slide">${v.title}</div>
`
}
});
this.initSwiper();
}
async getIndex() {
var res = await server.index();
// TODO 实现封装列表的渲染
res.recommended.data.forEach((v,i) => {
})
console.log("getIndex: ",res)
}
initSwiper() {
var liArr = _(".header_menu ul li");
var pageSwiper = new swiper('.swiper-container', {
time: 3,
auto: false,
speed: 800,
on: {
slideChangeTransitionStart: function (index) {
liArr.forEach(v => v.className = "")
liArr[index].className = "active"
}
}
});
liArr.forEach((v,i) => {
v.onclick = () => {
pageSwiper.slideTo(i)
liArr.forEach(v => v.className = "")
v.className = "active"
}
})
}
}
new Index();