实现了点击分类后正确跳转并展示该分类下书籍的功能。支持两种类型的分类:
分类列表页面 (/pages/category/category)
分类跳转逻辑
categoryId 筛选书籍列表页面 (/pages/more-books/more-books)
type 参数显示不同类型的书籍这些分类使用特殊的查询逻辑,不通过 categoryId 筛选:
| 分类名称 | type参数 | 接口 | 说明 |
|---|---|---|---|
| 全部分类 | all |
GET /api/book/all |
显示所有上架的书籍 |
| 排行榜 | ranking |
GET /api/book/ranking |
按综合热度排序 |
| 热门书籍 | popular |
GET /api/book/popular |
按浏览量和阅读量排序 |
| 新书榜 | new |
GET /api/book/new |
按创建时间排序 |
| VIP书籍 | vip |
GET /api/book/vip |
VIP专享书籍 |
这些分类通过 categoryId 筛选:
| 分类名称 | type参数 | 接口 | 说明 |
|---|---|---|---|
| 文学 | category |
GET /api/book/list?categoryId={id} |
显示指定分类的书籍 |
| 军事历史 | category |
GET /api/book/list?categoryId={id} |
显示指定分类的书籍 |
| 社会文化 | category |
GET /api/book/list?categoryId={id} |
显示指定分类的书籍 |
| 人物传记 | category |
GET /api/book/list?categoryId={id} |
显示指定分类的书籍 |
| 科学技术 | category |
GET /api/book/list?categoryId={id} |
显示指定分类的书籍 |
| 经济管理 | category |
GET /api/book/list?categoryId={id} |
显示指定分类的书籍 |
| ... | category |
GET /api/book/list?categoryId={id} |
其他分类 |
文件:books/pages/category/category.vue
goToCategoryBooks(category) {
const categoryName = category.name;
// 特殊分类:跳转到对应的特殊页面
if (categoryName === '全部分类') {
uni.navigateTo({
url: '/pages/more-books/more-books?type=all'
});
} else if (categoryName === '排行榜') {
uni.navigateTo({
url: '/pages/more-books/more-books?type=ranking'
});
} else if (categoryName === '热门书籍') {
uni.navigateTo({
url: '/pages/more-books/more-books?type=popular'
});
} else if (categoryName === '新书榜') {
uni.navigateTo({
url: '/pages/more-books/more-books?type=new'
});
} else if (categoryName === 'VIP书籍') {
uni.navigateTo({
url: '/pages/more-books/more-books?type=vip'
});
} else {
// 普通分类:跳转到该分类的书籍列表页面
uni.navigateTo({
url: `/pages/more-books/more-books?type=category&categoryId=${category.id}&categoryName=${encodeURIComponent(category.name)}`
});
}
}
文件:books/pages/more-books/more-books.vue
loadBooks() {
let promise;
if (this.type === 'all') {
// 全部分类:显示所有书籍
promise = getAllBooks(this.page, this.pageSize);
} else if (this.type === 'category' && this.categoryId) {
// 分类筛选:显示指定分类的书籍
promise = getBooks({
page: this.page,
size: this.pageSize,
categoryId: this.categoryId,
status: 1
});
} else if (this.type === 'ranking') {
// 排行榜
promise = getRankingBooks(this.pageSize * this.page);
} else if (this.type === 'popular') {
// 热门书籍
promise = getPopularBooks(this.pageSize * this.page);
} else if (this.type === 'new') {
// 新书榜
promise = getNewBooks(this.pageSize * this.page);
} else if (this.type === 'vip') {
// VIP书籍
promise = getVipBooks(this.page, this.pageSize);
}
// ... 其他类型
}
确保 categories 表中有正确的分类数据:
-- 查看所有分类
SELECT * FROM categories WHERE status = 1 ORDER BY sort_order;
确保 books 表中的书籍有正确的 category_id:
-- 查看分类及其书籍数量
SELECT
c.id,
c.name,
COUNT(b.id) as book_count
FROM categories c
LEFT JOIN books b ON c.id = b.category_id AND b.status = 1
GROUP BY c.id, c.name
ORDER BY c.sort_order;
-- 查看没有分类的书籍
SELECT id, title, author, category_id
FROM books
WHERE (category_id IS NULL OR category_id = 0) AND status = 1;
使用 update_books_category.sql 脚本为书籍分配分类:
-- 示例:为书籍分配分类
UPDATE books SET category_id = 6 WHERE id IN (1, 2, 3); -- 文学分类
UPDATE books SET category_id = 7 WHERE id IN (4, 5, 6); -- 军事历史分类
-- 根据实际情况调整
# 插入分类数据(如果还没有)
mysql -u root -p books_db < book/src/main/resources/db/category_data.sql
# 更新书籍分类(根据实际情况调整)
mysql -u root -p books_db < book/src/main/resources/db/update_books_category.sql
-- 查看分类及其书籍数量
SELECT
c.id,
c.name,
COUNT(b.id) as book_count
FROM categories c
LEFT JOIN books b ON c.id = b.category_id AND b.status = 1
GROUP BY c.id, c.name
ORDER BY c.sort_order;
category_idCOUNT(*) 统计的,只统计 status = 1(上架)的书籍原因:该分类下没有书籍,或者书籍的 category_id 不正确
解决方法:
-- 查看该分类下的书籍
SELECT * FROM books WHERE category_id = {分类ID} AND status = 1;
-- 为书籍分配分类
UPDATE books SET category_id = {分类ID} WHERE id IN (书籍ID列表);
原因:可能是接口调用失败,或者数据格式不正确
解决方法:
原因:分类名称不匹配
解决方法: