React Native如何快速如何快速入门（首先阅读！） _前端开发

文章图片
几个月前, 我开始使用React Native。我发现它既充满挑战又充满满足感。 React Native入门并不像许多其他框架那么顺畅, 但是一旦你克服了这些麻烦, 很快就会适应(特别是如果你已经具备Java技能)。这是我在学习过程中学到的一些东西, 如果你也开始进行React Native之旅, 这将对你有所帮助。
使用& & 运算符进行条件渲染
为了有条件地渲染组件, 在React中使用& & 运算符是很常见的。例如, 假设我们要显示用户详细信息(使用
用户详细信息
组件)当用户登录时。我们可以按照以下步骤进行操作

文章图片
这是如何工作的, 如果& & 运算符前面的值是真实的(新的JS语言)？这个out), 则呈现& & 运算符右侧的值。
但是, 在使用& & 运算符时, 你需要格外小心。假设在用户详细信息组件, 我们只想显示用户的电子邮件地址。因此, 我们可以再次使用与以下相同的& & 运算符

文章图片
但是, 请等待, 如果emailAddress为空字符串, 则你的应用程序将崩溃。是的, 它确实会崩溃。这是因为在本机反应中, 每个字符串(甚至是空字符串)都需要放在标记中才能呈现到屏幕。因此, 当emailAddress为空字符串时, 其计算结果为假值, 因此不会显示& & 运算符右侧的标记, 而是该应用尝试直接呈现值为""的emailAddress字符串, 然后崩溃。
【React Native如何快速如何快速入门（首先阅读！）】基于整数的条件渲染也是如此。例如, 你只想显示不为零的价格。你可以按以下方式进行

文章图片
再次由于相同的原因, 如果product.price的值为0, 这将再次使应用程序崩溃。
好吧, 那我们该如何解决这个问题呢？好, 我们有两种简单的方法
1.确保& & 运算符左侧的值是布尔值。
2.使用三元运算符

文章图片
Android和iOS上的不同行为

文章图片
始终牢记, 尽管大多数可在android上运行的代码都可以直接在iOS上运行, 反之亦然, 但是有些行为会有所不同。例如, 阴影和高程在android和iOS上的行为有所不同。
此外, 本机组件在Android和iOS上的行为可能有所不同。例如, "选择器"组件在Android和iOS上的行为有所不同。

文章图片

文章图片
始终尝试将组件分解为较小的组件
有时候, 我们觉得不需要为屏幕的一小部分制作单独的组件。但是, 在大多数情况下, 将其移至单独的组件是个好主意。从长远来看, 它可以在许多方面为你提供帮助
1.它易于在以后的阶段重构代码(如果需要)。
2.移动/修改屏幕的一部分更加容易, 因为它已经是独立的
3.你的代码不会不必要地紧密耦合不同的意图
请参阅官方文档, 网址为这个举个例子
尝试从CDN加载图像

文章图片
这是在移动应用程序上工作时应遵循的一般指导原则。 Web应用程序开发和移动应用程序开发的主要区别在于更新/修复应用程序的灵活性。对于Web Apps, 你可以随时随地自由发送更新, 人们几乎可以立即获得更新。但是, 对于Mobile Apps, 一旦你从头开始更新应用程序, 则取决于用户最终何时更新其应用程序并获取最新版本。另外, 如果用户经常需要更新你的应用程序, 那么频繁发送更新也可能会激怒他们。
现在回到从CDN加载图像的主题, 由于以下原因, 始终从CDN加载图像被视为最佳实践。
1.缩小的APK大小
2.使用旧版应用的用户会立即获得更新的图标/图像。
我面临的一个具体问题是, 我在应用程序中的每个标签上都有一些背景图片。我想介绍一个新标签。通过在后端进行一些更改, 我能够轻松地引入新标签。但是, 等等, 那个新添加的标签的背景图像呢？我意识到该新标签的背景图片不在应用程序资源中, 因此, 即使我发送添加了该图片的新更新, 使用旧版本的人仍然可以看到没有背景图片的那个标签。
在下面的评论中, 让我知道你对使用React Native的看法和经验。随时与我联系领英.