Gank代码分析

2018/12/5 posted in  web

主要分析js中的代码

  1. actions 存储所有的actions行为
    1. actionTypes.js action类型的常量定义,全局action常量
    2. handleCollectionData.js action的具体定义
    3. modifySettings.js
    4. requestCategoryData.js 调用接口获取目录数据
    5. requestHomeData.js 调用接口获取主页数据
    6. requestRandomData.js
  2. assets 图片放在这里
  3. components 定义公用的页面组件
    1. Avatar.js 所有的图标都走这个文件,后面使用,在其他页面引用使用
    2. BackPageComponent.js
    3. ListViewFooter.js 定义
      标签
    4. ListViewForCategory.js
    5. ListViewForCollection.js 定义标签,在首页使用
    6. ListViewForGirls.js
    7. ListViewForHome.js
    8. NavigationBar.js
    9. RowItemWithSwitcher.js
    10. SimpleRowItem.js
  4. constants 定义常量,颜色常量、后台绑定数据常量等
    1. colors.js 定义不同的颜色主题,在APP选择主题的地方可以选择
    2. fetchUrl.js 定义和后台数据绑定的url 这个使用的接口方式是直接get访问,不带任何token类型的,也不鉴权,后面这一块需要加上。
    3. theme.js 定义主题的颜色
  5. containers 定义各个页面的展示内容
    1. CollectionTab 收藏页面
    2. DiscoveryTab 发现页面
      1. GirlsPage.js 福利页面
      2. index.js 发现的首页
      3. TextListPage.js 前端数据页面
      4. VideoTabPage.js 休息视频页面
    3. HomeTab 主页
      1. index.js 主页
    4. MoreTab 更多的页面信息
      1. AboutAuthorPage.js 关于作者页面
      2. AboutGankPage.js 关于Gank
      3. index.js 更多页面配置
      4. OrderContentPage.js
      5. ThemeColorPage.js 主题颜色页面
    5. MainPage.js
    6. WebViewPage.js
  6. dao 存储数据,这个使用的存储是放在AsyncStorage中的,不同的数据指定不同的key存储
    1. FavouriteDataDAO.js
    2. HomeDataDAO.js
    3. RandomDataDAO.js
    4. SettingDataDAO.js
  7. native_modules
  8. reducers 定义不同的reducers
    1. categoryDataState.js
    2. favorDataState.js
    3. homeDataState.js
    4. index.js
    5. randomDataState.js
    6. settingState.js
  9. store 定义store
    1. index.js 使用中间件定义store
  10. utils
    1. fetchWithTimeout.js 设置读取超时时间
    2. getData.js 获取时间的工具
    3. handleHomeDataSource.js 获取目标页面的datasource (从这里可以看出来,所有的datasource是写在results的子集下面的)
    4. imageFactory.js 图片圆角工具
    5. px2dp.js px像素转化dp的工具
    6. shareUtil.js 分享工具
  11. App.js