这一小节中只给出一些API和Hook的索引,需要用到的时候可以去官网查询,如无必要此处不列出详细用法。React v1.19.1。
对Components的支持
API | description |
---|
<Fragment> | 通常使用 <>…</> 代替,它们都允许你在不添加额外节点的情况下将子元素组合。 |
<Profiler> | 测量 React 树的渲染性能 |
<StrictMode> | 目的是开发过程中尽早地发现组件中的常见错误,它主要是在程序运行过程中发出警告,只在开发环境中有效 |
<Suspense> | 也是一个过场动画的作用 |
API | description |
---|
<form> | 表单,代替html中的form |
<input > | 代替button, checkbox, radio等,并提供原始值,验证等功能 |
<select> | 下拉列表,配合option一同使用 |
<option> | 下拉列表 |
<progress> | 进度条 |
<textarea> | 多行文本输入框 |
<link > | 资源引入,比如css样式等 |
<meta> | meta元素定义 |
<script> | .js文件引入或js块代码 |
<style > | 内联 CSS 样式表 |
<title > | 文字标题 |
以上这些内置组件都支持以下属性
API | description |
---|
children | 子元素 |
ref | 使用 useRef 或者 createRef 的 ref 对象,或者一个 ref 回调函数 |
style | 内联样式 |
className | 指定css名称 |
accessKey | 指定快捷键 |
autoCapitalize | 指定输入内容大小写 |
draggable | 元素是否可拖动 |
hidden | 此元素是否被隐藏 |
aria-* | 为元素添加辅助信息 |
data-* | 将一些字符串数据附加到元素上,然后可以从 props 与 state 中读取数据 |
onKeyUp… | 还有很多类似的函数,可参考https://zh-hans.react.dev/reference/react-dom/components/common#common |
对Hook的支持
API | description |
---|
useActionState | 在表单提交后处理完成前的一个动作,它主要通过pending等属性来控制状态,依些完成相应的插入操作 |
useCallback | 在多次渲染中缓存函数 |
useContext | 全局参数 |
useDebugValue | 在调试工具中显示自定义的参数值,和在控制台输出类似 |
useDeferredValue | 延迟更新 UI 的某些部分 |
useEffect | 允许你 将组件与外部系统同步 |
useId | 相当于一个id生成器,通常用于给元素指定id或生成唯一值使用 |
useMemo | 在每次重新渲染的时候能够缓存计算的结果,可以和memo API配合使用 |
useReducer | 向组件里面添加一个 reducer,用于事件分发 |
useRef | 引用一个不需要渲染的值,即操作dom |
useState | 向组件添加一个 状态变量 |