目录正文如何使用它1.安装并导入 react-native-intro-carousel2.示例应用程序预览正文一个带有分页功能的介绍页面旋转木马(onboarding)动画。如何使用它1.安装并导入 react-native-intro-carousel# Yarn $ yarn add react-native-intro-carousel # NP ......
268
0
0
2023-06-06
目录React源码执行流程图legacyRenderSubtreeIntoContainerlegacyCreateRootFromDOMContainercreateLegacyRootReactDOMBlockingRootcreateRootImplcreateContainercreateFiberRootcreateHostRootFibercre ......
282
0
0
2023-06-05
目录问题描述查找原因问题解决问题描述react-native-code-push 安装后项目启动就报错。查找原因原以为是插件版本与RN版本不匹配导致,所以查了一下不同版本所对应的code-push插件:项目中的RN是0.66.3,但是并没有于此相匹配的版本,索性查看下所有版本吧,执行命令:npm view react-native-code-push ver ......
313
0
0
2023-06-05
目录在 React 中使用 Redux 解决的问题在 React 项目中加入 Redux 的好处React + Redux 安装 ReduxReact 中 Redux 的工作流程React 计数器案例使用 ReduxProvide 组件connect 方法使用 bindActionCreators 方法继续简化代码重构为 Action 传递参数Redux 弹 ......
272
0
0
2023-06-04
目录一、函数式组件捕获了渲染所用的值二、闭包让类组件成为拥有特定props和state的渲染三、区分useState与useRef的使用首先我们要知道的是,项目性能能主要取决于代码的作用,而不是选择函数式还是类组件。尽管优化策略各有略微不同,但它们之间的性能差异可以忽略不计。一、函数式组件捕获了渲染所用的值首先我们来看下面这个组件:function App( ......
272
0
0
2023-06-04
目录一、每一次渲染都有它自己的 Props and State二、每次渲染都有它自己的Effects三、关于依赖项不要对React撒谎四、两种诚实告知依赖的方法五、来自useReducer的助攻六、把函数移到Effects里七、我不想把可复用的函数放到Effect里这篇文章会假设你对useEffectAPI有一定程度的了解。一、每一次渲染都有它自己的 Pro ......
268
0
0
2023-06-04
目录一、Props 是什么二、props children模式1. props 插槽组件2. render props模式3. render props模式三、进阶实践一、Props 是什么先来看一个 demo :function Chidren(){ return <div> 我是子组件 </div> } /* props ......
262
0
0
2023-06-04
目录引言数据获取的分类React 获取数据与类库支持React 应用的性能React 生命周期与数据获取浏览器限制和数据获取出现请求瀑布流的原因解决请求瀑布流的方案Promise.all 方案并行 Promise 方案Data providers 抽象封装数据获取在 React 之前请求数据使用第三方类库做数据获取关于 Suspense总结引言如果你尝试过对 ......
339
0
0
2023-06-01
目录前言概念核心APIDndProviderBackenduseDraguseDrag返回三个参数useDrag传入两个参数DragSourceMonitor对象useDropuseDrag返回两个参数useDrop传入一个参数DropTargetMonitor对象数据流转拖拽预览DragPreviewImageuseDragLayer其他使用场景批量拖拽拖 ......
394
0
0
2023-06-01
目录正文代码结构DndProviderDragDropManageruseDragHTML5BackendTouchBackend总结正文React DnD 是一个专注于数据变更的 React 拖拽库,通俗的将,你拖拽改变的不是页面视图,而是数据。React DnD 不提供炫酷的拖动体验,而是通过帮助我们管理拖拽中的数据变化,再由我们根据这些数据进行渲染。我 ......
340
0
0
2023-06-01
目录1. 前言2. useState3. useEffect4. useLayoutEffect5. useMemo6. useCallback7. useRef8. useReducer9. useContext10. memo1. 前言react16.8推出hooks更好的支持函数组件,使用函数组件更容易进行代码的复用,拓展性更强。2. useState ......
260
0
0
2023-05-31
我们在写一些 UI 组件时,若不考虑动效,就很容易实现,主要就是有无的切换(类似于 Vue 中的 v-if 属性)或者可见性的切换(类似于 Vue 中的 v-show 属性)。 1. 没有动效的弹窗在 React 中,可以这样来实现: interface ModalProps { open: boolean; onClose?: () =&gt ......
288
0
0
2023-05-28
目录Router 组件的实现Routes 组件的实现Link 组件的实现Switch组件的实现createBrowserHistory 函数实现React Router 是一个用于 React 应用的路由库,它提供了一种简单的方式来将 URL 与组件匹配起来。React Router 实现了以下几个主要的概念:Router: 它提供了应用程序的基本 ......
305
0
0
2023-05-24
目录接口权限页面权限1. 菜单权限2. 路由权限按钮权限参考在一个后台管理系统中,安全是很重要的。不光后端需要做权限校验,前端也需要做权限控制。 我们可以大致将权限分为3种: 接口权限、页面权限、按钮权限。在这当中,前端主要关注点则是页面权限,按钮权限,而前端做这些的主要目的则是:禁止用户访问一些无权限访问的页面过滤不必要的请求,减少服务器压力下面主要是思路 ......
315
0
0
2023-05-21
目录前言知识点汇总场景1:使用Provider和Consumer生产和消费数据 文件目录及说明代码文件 ProductContext.js:效果场景2:使用ContextType接收数据文件目录及说明代码文件场景3:动态和静态Context代码文件效果场景4:在嵌套组件中更新Context代码文件效果场景5:消费多个Context代码文件前言传统的React ......
296
0
0
2023-05-14