qq_35876316的博客

React的函数式组件是React组件的一种形式，它使用JavaScript函数而不是类来定义组件。这种组件形式在React 16.8版本引入Hooks之后变得特别流行，因为它使得组件逻辑更加简洁、易于理解和测试。Welcome 是一个函数式组件。它接受一个名为 props 的参数，这个参数是一个对象，包含了传递给组件的所有属性。然后，组件返回一个JSX元素，这个元素会被React渲染到DOM中。

它允许你将一个 ref 传递给子组件，即使该子组件是通过函数式组件定义的。这在某些情况下很有用，比如当你需要直接访问 DOM 元素或类组件的实例时。vue则通过this.refsXX或thischildren访问子组件的Dom节点对象。

在一个文件中声明多个组件，但是文件变得太大的话就不方便查看了。要解决此问题，你可以将一个组件放到一个单独的文件中并（导出） export。组件，然后在另一个文件中（导入） import 该组件。

单花括号 {}：用于在JSX中嵌入单个JavaScript表达式。双花括号 {{}}：通常用于在JSX中嵌入一个JavaScript对象字面量作为prop的值。实际上，你可以把它看作是先定义了一个对象（内层花括号），然后再将这个对象作为一个表达式插入到JSX中（外层花括号）。注意：在大多数情况下，你不会在JSX中看到超过两层的花括号嵌套。如果你看到更多层的嵌套，那通常意味着代码可能过于复杂，可能需要考虑重构以提高可读性。

lazy

useContext 需要与 React.createContext() 一起使用。React.createContext() 会返回一个新的 React Context 对象。这个对象有两个属性：Provider 和Consumer。但是，useContext Hook 使得我们可以直接访问 Context 的值，而不需要使用 Consumer。

React内置组件 <Suspense> 允许在子组件完成加载前展示后备内容。和Vue的<Suspense>相似。

事件（event）在Web开发中是一个非常重要的概念。它们是由用户或浏览器与页面交互时触发的，例如点击按钮、滚动页面、提交表单等。事件处理器（event handler）是处理这些事件的函数，你可以在事件处理器中执行特定的操作，例如更新状态、导航到新的页面等。当你传入一个函数给 useEffect 时，React会在每次组件渲染后（包括组件的首次渲染）调用这个函数。但请注意，它并不会阻塞浏览器更新屏幕，因此你的应用看起来仍然是响应式的。

useContext 接收一个 React Context 对象（React.createContext 的返回值）并返回该。它使得你可以无需明确地逐层通过 props 来传递数据，而是在组件之间的任何位置直接访问 React 的 Context。用于在函数组件中添加状态。它返回一个状态变量和一个更新该状态的函数。这使得函数组件能够像类组件一样具有状态。用于在函数组件中执行副作用操作，比如数据获取、订阅、手动修改 DOM 等。它的工作方式与类组件中的。Context 的当前值。

如果你正在编写一个 自定义 Hook，建议将它返回的任何函数包裹在 useCallback 中。//这确保了 Hook 的使用者在需要时能够优化自己的代码return {navigate,goBack,

React 应用程序是由 组件 组成的。一个组件是 UI（用户界面）的一部分，它拥有自己的逻辑和外观。组件可以小到一个按钮，也可以大到整个页面。以 use 开头的函数被称为 Hook。useState 是 React 提供的一个内置 Hook。react有很多内置的 Hook。其他单独做一个系列讲。6.如何对事件做出响应并更新界面。2.使用 JSX 编写标签。7.如何在组件间共享数据。1.如何创建和嵌套组件。5.如何渲染条件和列表。以上就是一些基本知识。

通常使用 … 代替，它们都允许你在不添加额外节点的情况下将子元素组合。

React本身是为构建SPA（单页面应用）而设计的。

【代码】React 之 内置方法setState改变state（一）

ref 是一种脱围机制，用于保留不用于渲染的值。你不会经常需要它们。ref 是一个普通的 JavaScript 对象，具有一个名为 current 的属性，你可以对其进行读取或设置。你可以通过调用 useRef Hook 来让 React 给你一个 ref。与 state 一样，ref 允许你在组件的重新渲染之间保留信息。与 state 不同，设置 ref 的 current 值不会触发重新渲染。不要在渲染过程中读取或写入 ref.current。这使你的组件难以预测。

它允许你“记住”一些计算值，只有在依赖项之一发生变化时才会重新计算这些值。这有助于避免不必要的重新计算和渲染，从而提高应用程序的性能。

返回一个与 fn 具有相同类型签名的已缓存版本。在此过程中，它不会调用 fn。：要对其结果进行缓存的函数。fn 可以接受任何参数并返回任何值。

react系列---------ReactJS最优秀的UI框架构建你的下一个 React.js APP，有这些优秀的 UI 框架就够了。一.Material-UI　　Material-UI是一款React组件库来实现Google的Material Design风格UI界面框架。也是首个React的UI工具集之一。使用它可以快速搭建出赏心悦目的应用界面。　　英文文档：https://material-ui.com二.React-Bootstrap　　React-Bootstrap是..