<Suspense>组件的基本结构与作用
<Suspense>是一个内置组件，用来在组件树中协调对异步依赖的处理。它让我们可以在组件树上层等待下层的多个嵌套异步依赖项解析完成，并可以在等待时渲染一个加载状态。
-
插槽结构：
<Suspense>组件有两个特殊插槽，分别是默认插槽#default和后备（或占位符）插槽#fallback。这两个插槽都只能放置一个直接子节点。#default插槽：用于放置那些可能含有异步依赖（如异步组件）的主要内容。#fallback插槽：用于定义在等待异步内容加载完成时展示给用户的“加载中”或其他临时内容。
渲染流程与状态
- 初始渲染：当页面首次渲染时，
<Suspense>会尝试渲染#default插槽中的内容。如果这部分内容没有异步依赖，<Suspense>会直接进入完成状态，用户看到的是默认内容。 - 遇到异步依赖：如果在渲染过程中遇到了异步依赖（例如异步组件开始加载），
<Suspense>会进入挂起状态，此时它会隐藏#default插槽的内容，转而展示#fallback插槽的内容（比如“Loading...”信息），直到所有异步依赖完成加载。 - 完成状态：一旦所有异步依赖加载完毕，
<Suspense>会再次回到完成状态，显示#default插槽的最终内容给用户。
特殊行为与配置
- 回退与延迟显示：一旦进入完成状态，除非
#default插槽的根节点被替换（即主要内容发生变化），否则即使遇到新的异步依赖，<Suspense>也不会再次进入挂起状态。这意呀着，对于已渲染完成的内容，后续的局部异步更新不会触发加载提示。 - timeout属性：为了控制用户体验，
<Suspense>提供了一个timeout属性。如果在等待新内容渲染的时间超过了设定的timeout值（单位通常是毫秒），即使异步依赖尚未完成，也会切换到显示#fallback插槽的内容。如果设置timeout为0，则表示一旦需要加载新内容，立即显示加载提示，不等待任何延迟。
