十年网站开发经验 + 多家企业客户 + 靠谱的建站团队
量身定制 + 运营维护+专业推广+无忧售后,网站问题一站解决
项目介绍
主要页面
1、首页home.vue分类展示书籍,幻灯片展示热门推荐
2、搜索search.vue,上拉加载更多
3、书籍详情book.vue加入书架、立即阅读,展示评论,同类书籍推荐
4、书籍内容read.vue,获取目录,存储翻阅的章节位置,
5、书架bookrack.vue,获取加入书架的书单
技术栈
vue、vue-cli、axios、vue-router、vuex、localStorege
分成底部导航 跟 主视图容器 router-view
首页tabbar/Home
小说楼层单独定义了组件 components/sub/item
, home循环楼层分类名称,并将楼层分类id传给item组件 :booklistId='{id:item._id}'
, item组件用 props: ["booklistId"]
接收分类id, 并根据分类id获取对应的数据
item.vue
mouted: this.getlist(this.booklistId.id); methods: getlist(id) { //每个分类id下对应的数据 子组件接收父组件传过来的id 获取对应的数据 bootd(id).then(res => { var arrdata = res.data.data; arrdata.map(item => { this.booklist.push(item.book); }); }); }