/ZhiHuForReactNative

Primary LanguageJavaScript

ZhiHuForReactNative

仿知乎客户端，使用 React Native 开发。

已完成功能

  1. 底部的导航栏。
  2. 推荐页面顶部 tab 栏。
  3. 推荐页面。
  4. 推荐页面数据下拉刷新和上拉加载更多。
  5. 文章详情页面。
  6. 通过接口获取数据。

TODO

  1. 移除 react-native-vector-icons 引用到的多余字体文件，减少包体积
  2. 推荐页面顶部的搜索栏
  3. 详情页面顶部操作栏，显示返回按钮
  4. 推荐页面单个文章更多操作弹窗
  5. 适配横屏
  6. ESLint 规则调整
  7. 完成 splash screen 。

问题

1. 真机错误 The development server returned response error code: 500

不在同一个网段中。网络连接在同一个网段中解决问题。

yarn start 启动项目，终端运行一直卡着：Loading dependency graph, done.

Loading dependency graph, done

使用 react-native run-android。yarn start 命令对设备无效，对模拟器有效，所以一直卡在 Loading dependency graph, done 。

2. 在开发者模式，使用设备调试应用。� 将连接电脑的 USB 线拔掉重新插上，提示不能连接到开发者服务器。

执行 adb reverse tcp:8081 tcp:8081 命令，转发端口数据。

3. Slider has been extracted from react-native core and will be removed in a future release. It can now be installed and imported from '@react-native-community/slider' instead of 'react-native'.

react-native-gesture-handler 依赖导致的错误

4. ViewPagerAndroid has been extracted from react-native core and will be removed in a future release. It can now be installed and imported from '@react-native-community/viewpager' instead of 'react-native'.

react-native-gesture-handler 依赖导致的错误

5. 阴影属性

ios 支持，android 不支持。

6. React Native Debugger 不能在 Network 面板上查看网络请求。

在面板上鼠标右击，点击 Enable Network Inspect，启用网络请求检查。重新加载页面，在 Network 面板中查看请求。

资料

  1. ReactNative 中文文档
  2. React Navigation
  3. React+RN 开发过程中的一些问题总结
  4. react native 开发实践
  5. React Native 调试技巧与心得
  6. 为什么 React Native 连遭 Airbnb、Udacity 抛弃？