摘要本文总结了 ReactNative 开发中常见问题及解决方法。从 ScrollView 在 TouchableOpacity 组件内滑动困难到 Xcode 编译路径设置，都有相应解决方案。此外，还介绍了热更新问题、高度获取、强制横屏UI适配、清理缓存等实用技巧。引言ReactNative 作为一种跨平台开发框架，尽管强大，但也常伴随着一些问题。本文收集并
......
57
0
0
2024-03-19
React 知命境第 35 篇，原创第 142 篇我们知道，Scheduler 是 React 提供的底层调度器。但是这个调度器具体是如何用的，可能大部分人都不太清楚了，好在 React 把内部的模块封装得都相对独立，因此，我们可以想个办法，单独把他的 Scheduler 或者 Reconciler 单独掏出来用。1怎么掏在 React 的 github 仓
......
53
0
0
2024-03-15
当前问题现在编译时间过长,镜像构建时长就达到了20分钟+通过项目依赖升级后,镜像构建时长大约3-5分钟修改内容之前的技术方案:roadhog(2.x)+antd(3.x)+React(16.x)+dva(2.x)现在的技术方案:[Create React App]craco(7.x)+antd(5.x)+React(18.x)+react-redux(9.x
......
65
0
0
2024-03-11
Suspense 组件想必大家都用过，一般是和 React.lazy 结合用，用来加载一些异步组件。比如这样一个组件：// src/Aaa.jsx
export default function Aaa() {
return <div>aaa</div>
}
就可以在另一个组件里用 lazy + Suspense 异步
......
317
0
0
2024-03-10
React 知命境第 31 篇在 React 中，有一个高大上的概念，叫做并发模式 Concurrent React。在并发模式中，引入了两个新概念：任务优先级、异步可中断。当一个任务正在 Reconciler 阶段执行时，如果此时 Scheduler 发现了一个优先级更高的任务，那么，React 可以把正在执行的任务中断，从 Scheculer 中把优先级
......
88
0
0
2024-03-04
引用方式第一种：内联方式可以使用变量或者传统的内联方式优点: 只生效于当前组件
缺点: 可能产生大量重复代码
import react, { Component } from "react";
const sty = {
width: "100px",
backgroundColor: "#FFFFFF", //注意：需要使用驼峰
......
64
0
0
2024-02-25
「React 知命境」第 29 篇在前面的章节中，我们学习了 context 的使用方式，基于它我们可以搞一个自己的状态管理库。不过，他存在性能上的问题，以致于虽然从功能的实现上来说，他非常不错，但是从性能上来说，context 的表现非常糟糕，虽然很少有 React 学习者关注到这个问题，但是如果你关注项目的整体架构，并且想要成为顶尖高手的话，这是你必须掌
......
70
0
0
2024-02-19
条件渲染和其它的语言一样的逻辑在 React 中,我们可以通过 JavaScript 里面咋用的它里面就咋用比如使用 JavaScript 的 if 语句、&& 和 ? : 运算符来选择性地渲染 JSX条件返回不同的 JSX我们定义一个水果集合组件,里面定义多个水果组件,每个物品可标记为打包与否接下来我们给 JSX 组件判断一下 true 为
......
75
0
0
2024-02-15
react18-webchat 基于vite4.x+react18创建网页版聊天实战项目。使用了react18+react-router+zustand+arco design+react-dialog等技术开发构建项目。react-webchat 整个项目遵循react18 hooks编码开发。支持图文混合emoj、图片/视频预览、红包/朋友圈、网址预览等
......
80
0
0
2024-02-04
React 在如何组织结构方面非常开放。这正是为什么我们有责任保持项目的整洁和可维护性。今天，我们将讨论一些改善 React 应用程序健康状况的最佳实践。这些规则被广泛接受。因此，掌握这些知识至关重要。所有内容都将以代码展示，所以做好准备！1. 使用 JSX 简写尝试使用 JSX 简写来传递 Boolean 布尔值变量。假设您想要控制导航栏组件的标题可见性。
......
87
0
0
2024-02-04
React Hooks是React 16.8版本引入的新特性，它的作用是为函数组件提供了状态管理和副作用处理的能力。在React之前，函数组件被限制在只能使用无状态的函数组件，无法使用状态和生命周期方法。Hooks的引入解决了这个限制，使得函数组件可以拥有和类组件相似的功能。React Hooks的主要作用包括：状态管理：通过useState Hook，函数
......
90
0
0
2024-02-03
背景在前端开发的过程中,一些表单的输入经常需要输入多个内容,如果采用一个输入框+逗号分隔的方式,展示起来不是很清晰,一般需要采用标签的方式需求可以指定空状态时的标题设置标签颜色每个标签的最大长度(字符数)接口传递的时候的分隔标记(是用逗号,还是其他)直接处理表单,不需要二次处理所以需要传入以下内容给该组件title:标题separator:分隔标记maxLe
......
77
0
0
2024-02-03
众所周知，JavaScript 中的闭包（Closures）一定是这种语言最可怕的特性之一，即使是无所不知的 ChatGPT 也是这样说的。另外它可能也是最隐蔽的语言特性之一，我们在编写 React 代码时经常会用到它，但是大多数时候我们甚至没有意识到这一点。但是，我们终究还是离不开它：如果我们想编写复杂且性能很好的 React 应用，就必须了解闭包。所以，
......
76
0
0
2024-01-31
目录说明题目首次渲染流程renderbeginWorkcompleteUnitOfWorkcommit准备阶段before mutation 阶段mutation 阶段切换 Fiber Treelayout 阶段题目解析总结说明本文结论均基于 React 16.13.1 得出，若有出入请参考对应版本源码。参考了 React 技术揭秘。题目在开始进行源码分析前
......
131
0
0
2023-09-08
目录应用场景效果预览思路剖析原生代码实现迁移到React总结应用场景懒加载列表或叫做无限滚动列表，也是一种性能优化的方式，其可疑不必一次性请求所有数据，可以看做是分页的另一种实现形式，较多适用于移动端提升用户体验，新闻、资讯浏览等。效果预览思路剖析设置临界元素，当临界元素进入可视范围时请求并追加新数据。根据可视窗口和滚动元素组建的关系确定数据加载时机。con
......
145
0
0
2023-09-07