【笔记】React Native实战练习(仿网易云游戏网页移动端)

复制代码
/**
* 如果系统看一遍RN相关官方文档,可能很快就忘记了。一味看文档也很枯燥无味,
* 于是大概看了关键文档后,想着直接开发一个Demo出来,边学边写,对往后工作
* 开发衔接上能够更顺。这期间肯定会遇到各种各样的问题,所以也算是一个积累
* 经验的小过程。
*/

准备工作:直接在前面两篇笔记的项目基础上,然后随便找了个网易云游戏网页(在Google浏览器上打开调试模式,选择手机模式,网易云游戏网页正好有适配移动端)。

网易云游戏:https://cg.163.com/#/game/recommend

定个小目标,首先先看下四个模块原效果,当前项目本打算依赖Ant Design Mobile,看看不借助其他UI框架能碰到哪些问题。

打算将期间遇到的问题都记录下来,最后放上实际效果的视频或截图。

问题1:组件内如何使用React Navigation跳转页面?

在组件里直接拿不到navigation,当前做法是用React props组件传数据,将Home.tsx里的navigation向组件往下传。(# 那如果组件里的组件,嵌套N层呢,这个需要如何处理呢?我想有React/Vue开发经验的都晓得不能这样做,耦合太高了,而且维护起来还费头发#)

忘了补充一个小知识点,这里可以自行选择是否可空(使用时要安全判断调用),其他地方使用组件就不会强制要传参而报错

截止2024-02-02->有空会陆续记录在文章里...

相关推荐
全栈前端老曹3 天前
【ReactNative】核心组件与 JSX 语法
前端·javascript·react native·react.js·跨平台·jsx·移动端开发
光影少年3 天前
RN vs Flutter vs Expo 选型
前端·flutter·react native
Swift社区4 天前
RN 项目中“页面存在 ≠ 页面可见”会导致哪些隐藏 Bug?
react native·bug·react
赵财猫._.5 天前
React Native鸿蒙开发实战(十):鸿蒙NEXT深度适配与未来展望
react native·react.js·harmonyos
2401_860319525 天前
在React Native鸿蒙跨平台开发采用分类网格布局,通过paramRow和paramLabel/paramValue的组合展示关键配置信息
react native·react.js·harmonyos
2301_796512525 天前
使用如Redux、MobX或React Context等状态管理库来管理状态,React Native鸿蒙跨平台开发来实战
react native·react.js·harmonyos
洞窝技术5 天前
自建 React Native 热修复,让线上事故 30 秒“归零”
react native
2401_860494705 天前
在React Native中实现鸿蒙跨平台开发中开发一个运动类型管理系统,使用React Navigation设置应用的导航结构,创建一个堆栈导航器
react native·react.js·harmonyos
2301_796512525 天前
使用状态管理、持久化存储或者利用现有的库来辅助React Native鸿蒙跨平台开发开发一个允许用户撤销删除的操作
javascript·react native·react.js
2301_796512525 天前
React Native鸿蒙跨平台开发包含输入收入金额、选择收入类别、记录备注和日期等功能,实战react-native-paper组件
javascript·react native·react.js