Vue实战项目 分类页 category

1 获取数据

分析数据结构

1
2
3
/catagory  (无参数) ——》maitKey、miniWallkey 、title
/subcategory (maitKey)  ——》 subcategories ([])
/subcategory/detail (miniWallkey，type) ——》categoryDetail ({})

可以看出不同的 title 有不同的数据，将给个title 对应的数据存储在 categoryData 里面，数据之间通过 index 联系。简化数据结构如下

more >>

展开全文 >>

Vue实战项目 二

1 vue-router 路由

路由懒加载语法；默认路由的设置；<router-view>占位

2 TabBar 组件

  • MainTabBar ：和项目相关，指定每个视图的 path ，以及文字的激活状态。这个组件决定了 一个 TabBar 里面有 几个 TabBarItem。

  • TabBar ：独立的组件，内置一个 slot ，和整个 tabBar 的高度等布局有关

more >>

展开全文 >>

tag:

    缺失模块。
    1、请确保node版本大于6.2
    2、在博客根目录（注意不是yilia根目录）执行以下命令：
    npm i hexo-generator-json-content --save

    3、在根目录_config.yml里添加配置： 

      jsonContent:
    meta: false
    pages: false
    posts:
      title: true
      date: true
      path: true
      text: false
      raw: false
      content: false
      slug: false
      updated: false
      comments: false
      link: false
      permalink: false
      excerpt: false
      categories: false
      tags: true

很惭愧<br><br>只做了一点微小的工作<br>谢谢大家