React共19篇

React中如何实现条件渲染?

React中如何实现条件渲染?-速码派
写React组件时,一个最常见的场景就是根据某些条件来决定显示什么内容。用户登录没登录、数据加载没加载完、表单是编辑模式还是查看模式,这些都需要条件渲染。React提供了好几种方式来实现,它...
MRzhang的头像-速码派MRzhang2026年1月25日
03414

什么是React的Ref?怎么用?

什么是React的Ref?怎么用?-速码派
在React的数据流世界里,ref是一个有点特别的逃生口。它让你能直接访问DOM元素或者React组件实例,跳过props和state的那套更新机制。简单说,ref就是你通向真实DOM或组件实例的一根“直达线”。...
MRzhang的头像-速码派MRzhang2026年1月25日
0238

什么是React的上下文(Context)?

什么是React的上下文(Context)?-速码派
在React里,数据通常通过props从上往下传。但如果组件树很深,中间每一层都得帮忙传一下props,这就很烦人,像“prop drilling”(属性钻取)。React的Context(上下文)就是为了解决这个痛点,...
MRzhang的头像-速码派MRzhang2026年1月25日
02310

如何自定义Hook?

如何自定义Hook?-速码派
自定义Hook大概是React Hooks最迷人的特性了。它让你能把组件里那些纠缠在一起的逻辑抽出来,变成一个独立、可复用的函数。这可不是什么高阶组件或者渲染属性那种绕弯子的复用,而是最直接的函...
MRzhang的头像-速码派MRzhang2026年1月25日
0396

useEffect和useLayoutEffect有什么区别?

useEffect和useLayoutEffect有什么区别?-速码派
在React里,useEffect和useLayoutEffect这对兄弟Hook都能让你处理副作用,比如操作DOM、发起请求。它们长得像,但执行的时机有微妙而重要的区别。用错了,可能会导致页面闪烁或者性能问题。 关...
MRzhang的头像-速码派MRzhang2026年1月25日
02712

useState和useReducer有什么区别?

useState和useReducer有什么区别?-速码派
在React函数组件里管理状态,useState是你的老朋友,简单直接。但当状态逻辑变得复杂,一堆setState挤在一起互相影响时,useReducer就该登场了。它俩都能管状态,但脾气和适用场景很不一样。 us...
MRzhang的头像-速码派MRzhang2026年1月25日
0469

什么是React Hooks?常用的Hooks有哪些?

什么是React Hooks?常用的Hooks有哪些?-速码派
React Hooks大概是这几年React生态里最重要的一次变革。简单说,它是一系列函数,让你能在函数组件里“钩入”React的特性,比如状态、生命周期。以前这些能力只有类组件才有,现在函数组件啥都...
MRzhang的头像-速码派MRzhang2026年1月25日
02712

什么是React的合成事件?

什么是React的合成事件?-速码派
在React里写onClick、onChange这些事件处理的时候,你有没有想过,它跟直接在HTML里写onclick是不是一回事?其实不是。React自己搞了一套事件系统,叫“合成事件”。它把浏览器的原生事件包装了...
MRzhang的头像-速码派MRzhang2026年1月25日
04610

如何给React组件添加样式?

如何给React组件添加样式?-速码派
给React组件打扮一下,让它好看点,有好几种路子。每种方法都有自己的脾气,选哪种得看你的组件是啥性格,还有项目多大。 最直接的办法:内联样式 在JSX里,直接用style属性写,这是最快上手的...
MRzhang的头像-速码派MRzhang2026年1月25日
0315

什么是JSX?和HTML有什么区别?

什么是JSX?和HTML有什么区别?-速码派
刚开始写React,你肯定会盯着那些.jsx或.js文件里的代码犯嘀咕:这看着像HTML,但又直接写在JavaScript里,还混着些{ }花括号,这到底是个啥?这东西叫JSX,它是React的核心“方言”,理解它和H...
MRzhang的头像-速码派MRzhang2026年1月25日
0265