Vue3 Suspense：是什么？能干什么？如何用
<p><span style="font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; font-size: 14px; background-color: rgb(255, 255, 255);">本篇文章带大家深入了解一下</span><a href="https://www.php.cn/course/list/18.html" target="_blank" style="margin: 0px; padding: 0px; color: rgb(61, 167, 13); font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; font-size: 14px; white-space: normal; background-color: rgb(255, 255, 255); text-decoration-line: none !important;">Vue3</a><span style="font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; font-size: 14px; background-color: rgb(255, 255, 255);"> Suspense，聊聊Suspense是什么、能干什么，以及如何使用它，希望对大家有所帮助！</span></p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);"><br/></p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);"></p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);"><strong style="margin: 0px; padding: 0px;">Suspense</strong> 不是你想的那样。是的，它帮助我们处理异步组件，但它的作用远不止于此。（学习视频分享：<a href="https://www.php.cn/course/list/18.html" target="_blank" textvalue="vue视频教程" style="margin: 0px; padding: 0px; color: rgb(61, 167, 13); text-decoration-line: none !important;">vue视频教程</a>）</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);"><strong style="margin: 0px; padding: 0px;">Suspense</strong> 允许我们协调整个应用程序的加载状态，包括所有深度嵌套的组件。而不是像一个爆米花用户界面一样，到处都是 loading，组件突然奔的一下到位</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);"></p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">有了 Suspense， 我们可以有一个单一的、有组织的系统，一次性加载所有东西。</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);"></p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">而且，Suspense 也给我们提供了细粒度的控制，所以如果需要的话，我们可以在两者之间实现一些东西。</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">在这篇文章中，我们将学到很多关于 Suspense 的知识--它是什么，能干什么，以及如何使用它。</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">首先，我们将仔细看看这些爆米花界面。然后，在看看如何使用Suspense来解决这些问题。之后，尝试通过在整个应用程序中嵌套Suspense来获得更精细的控制。最后，简单看看如何使用占位符来丰富我们的用户界面。</p><h3 style="margin: 0px; padding: 0px; font-weight: 400; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);"><strong style="margin: 0px; padding: 0px;">爆米花UI-- Suspense 之前</strong></h3><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">事例地址：https://codesandbox.io/s/uncoordinated-loading-before-suspense-srh8ll?file=/src/App.vue</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">如果没有 Suspense，每个组件都必须单独处理其加载状态。</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);"></p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">这可能导致一些相当糟糕的用户体验，多个加载按钮和内容突然出现在屏幕上，就像你在制作爆米花一样。</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">虽然，我们可以创建抽象组件来处理这些加载状态，但这比使用Suspense要困难得多。有一个单一的点来管理加载状态，比每个组件做自己的事情要容易维护得多。</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">在事例中，我们使用<code style="margin: 0px; padding: 2px 4px; font-size: 14.4px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px;">BeforeSuspense</code>组件来模拟一个内部处理加载状态的组件。把它命名为<code style="margin: 0px; padding: 2px 4px; font-size: 14.4px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px;">BeforeSuspense</code>，因为一旦我们实现了Suspense，我们就会把它重构为<code style="margin: 0px; padding: 2px 4px; font-size: 14.4px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px;">WithSuspense</code>组件。</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);"><strong style="margin: 0px; padding: 0px;">BeforeSuspense.vue</strong></p><table class="wcn_c_table" cellpadding="0" cellspacing="0" width="760"><tbody style="margin: 0px !important; padding: 0px !important; border-radius: 0px !important; background: none !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><tr style="margin: 0px !important; padding: 0px !important; border-radius: 0px !important; background: none !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;" class="firstRow"><td class="gutter" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); margin: 0px !important; border-radius: 4px 0px 0px 4px !important; background: none !important; inset: auto !important; float: none !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; box-sizing: content-box !important; min-height: auto !important; color: rgb(175, 175, 175) !important; user-select: none !important;" width="NaN"><p class="line number1 index0 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">1</p><p class="line number2 index1 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">2</p><p class="line number3 index2 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">3</p><p class="line number4 index3 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">4</p><p class="line number5 index4 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">5</p><p class="line number6 index5 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">6</p><p class="line number7 index6 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">7</p><p class="line number8 index7 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">8</p><p class="line number9 index8 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">9</p><p class="line number10 index9 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">10</p><p class="line number11 index10 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">11</p><p class="line number12 index11 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">12</p><p class="line number13 index12 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">13</p><p class="line number14 index13 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">14</p><p class="line number15 index14 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">15</p><p class="line number16 index15 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">16</p><p class="line number17 index16 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">17</p><p class="line number18 index17 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">18</p><p class="line number19 index18 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">19</p><p class="line number20 index19 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">20</p><p class="line number21 index20 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">21</p></td><td class="code" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); word-break: break-all; margin: 0px !important; border-radius: 0px !important; background: none !important; inset: auto !important; float: none !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; box-sizing: content-box !important; min-height: auto !important;" width="712"><p class="line number1 index0 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><template></code></p><p class="line number2 index1 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><div </code><code class="php keyword" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; font-weight: bold !important; min-height: auto !important;">class</code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">=</code><code class="php string" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">async-component</code> <code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">:</code><code class="php keyword" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; font-weight: bold !important; min-height: auto !important;">class</code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">=</code><code class="php string" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">!loading && loaded</code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">></code></p><p class="line number3 index2 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><Spinner v-</code><code class="php keyword" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; font-weight: bold !important; min-height: auto !important;">if</code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">=</code><code class="php string" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">loading</code> <code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">/></code></p><p class="line number4 index3 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><slot /></code></p><p class="line number5 index4 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"></div></code></p><p class="line number6 index5 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"></template></code></p><p class="line number7 index6 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"> </p><p class="line number8 index7 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><script setup></code></p><p class="line number9 index8 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">import { ref } from </code><code class="php string" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">vue</code></p><p class="line number10 index9 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">import Spinner from </code><code class="php string" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">./Spinner.vue</code></p><p class="line number11 index10 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"> </p><p class="line number12 index11 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php keyword" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; font-weight: bold !important; min-height: auto !important;">const</code> <code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">loading = ref(true)</code></p><p class="line number13 index12 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php keyword" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; font-weight: bold !important; min-height: auto !important;">const</code> <code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">{ time } = defineProps({</code></p><p class="line number14 index13 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">time: {</code></p><p class="line number15 index14 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">type: Number,</code></p><p class="line number16 index15 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php keyword" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; font-weight: bold !important; min-height: auto !important;">default</code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">: 2000</code></p><p class="line number17 index16 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">}</code></p><p class="line number18 index17 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">})</code></p><p class="line number19 index18 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"> </p><p class="line number20 index19 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">setTimeout(() => (loading.value = false), time)</code></p><p class="line number21 index20 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"></script></code></p></td></tr></tbody></table><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">一开始设置 loading 为 <code style="margin: 0px; padding: 2px 4px; font-size: 14.4px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px;">true</code>，所以显示 <code style="margin: 0px; padding: 2px 4px; font-size: 14.4px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px;">Spinner</code> 组件。然后，当<code style="margin: 0px; padding: 2px 4px; font-size: 14.4px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px;">setTimeout</code>完成后，将 loading 设置为 <code style="margin: 0px; padding: 2px 4px; font-size: 14.4px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px;">false</code>，隐藏 <code style="margin: 0px; padding: 2px 4px; font-size: 14.4px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px;">Spinner</code> 并使组件的背景为绿色。</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">在这个组件中，还包括一个 <code style="margin: 0px; padding: 2px 4px; font-size: 14.4px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px;">slot</code> ，这样其它组件就可以套在 <code style="margin: 0px; padding: 2px 4px; font-size: 14.4px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px;">BeforeSuspense</code> 组件中了:</p><table class="wcn_c_table" cellpadding="0" cellspacing="0" width="760"><tbody style="margin: 0px !important; padding: 0px !important; border-radius: 0px !important; background: none !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><tr style="margin: 0px !important; padding: 0px !important; border-radius: 0px !important; background: none !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;" class="firstRow"><td class="gutter" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); margin: 0px !important; border-radius: 4px 0px 0px 4px !important; background: none !important; inset: auto !important; float: none !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; box-sizing: content-box !important; min-height: auto !important; color: rgb(175, 175, 175) !important; user-select: none !important;" width="NaN"><p class="line number1 index0 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">1</p><p class="line number2 index1 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">2</p><p class="line number3 index2 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">3</p><p class="line number4 index3 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">4</p><p class="line number5 index4 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">5</p><p class="line number6 index5 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">6</p><p class="line number7 index6 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">7</p><p class="line number8 index7 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">8</p><p class="line number9 index8 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">9</p><p class="line number10 index9 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">10</p></td><td class="code" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); word-break: break-all; margin: 0px !important; border-radius: 0px !important; background: none !important; inset: auto !important; float: none !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; box-sizing: content-box !important; min-height: auto !important;" width="712"><p class="line number1 index0 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><template></code></p><p class="line number2 index1 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><button @click=</code><code class="php string" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">reload</code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">>Reload page</button></code></p><p class="line number3 index2 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><BeforeSuspense time=</code><code class="php string" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">3000</code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">></code></p><p class="line number4 index3 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><BeforeSuspense time=</code><code class="php string" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">2000</code> <code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">/></code></p><p class="line number5 index4 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><BeforeSuspense time=</code><code class="php string" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">1000</code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">></code></p><p class="line number6 index5 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><BeforeSuspense time=</code><code class="php string" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">500</code> <code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">/></code></p><p class="line number7 index6 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><BeforeSuspense time=</code><code class="php string" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">4000</code> <code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">/></code></p><p class="line number8 index7 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"></BeforeSuspense></code></p><p class="line number9 index8 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"></BeforeSuspense></code></p><p class="line number10 index9 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"></template></code></p></td></tr></tbody></table><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">没有什么太花哨的东西。只是一些嵌套的组件，有不同的时间值传递给它们。</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">下面，我们来看看怎么通过使用 <code style="margin: 0px; padding: 2px 4px; font-size: 14.4px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px;">Suspense</code> 组件来改进这个爆米花用户界面。</p><h2 style="margin: 0px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);"><strong style="margin: 0px; padding: 0px;">Suspense</strong></h2><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">事例地址：https://codesandbox.io/s/coordinated-loading-with-suspense-b6dcbi?file=/src/App.vue</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">现在，我们使用<code style="margin: 0px; padding: 2px 4px; font-size: 14.4px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px;">Suspense</code>来处理这些乱七八糟的东西，并将其变成一个更好的用户体验。</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">不过，首先我们需要快速了解一下Suspense到底是什么</p><h4 style="margin: 0px; padding: 0px; font-weight: 400; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); font-size: 14px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);"><strong style="margin: 0px; padding: 0px;">Suspense 基础知识</strong></h4><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">以下是 Suspense 部分的基本结构</p><table class="wcn_c_table" cellpadding="0" cellspacing="0" width="760"><tbody style="margin: 0px !important; padding: 0px !important; border-radius: 0px !important; background: none !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><tr style="margin: 0px !important; padding: 0px !important; border-radius: 0px !important; background: none !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;" class="firstRow"><td class="gutter" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); margin: 0px !important; border-radius: 4px 0px 0px 4px !important; background: none !important; inset: auto !important; float: none !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; box-sizing: content-box !important; min-height: auto !important; color: rgb(175, 175, 175) !important; user-select: none !important;" width="NaN"><p class="line number1 index0 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">1</p><p class="line number2 index1 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">2</p><p class="line number3 index2 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">3</p><p class="line number4 index3 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">4</p><p class="line number5 index4 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">5</p><p class="line number6 index5 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">6</p><p class="line number7 index6 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">7</p></td><td class="code" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); word-break: break-all; margin: 0px !important; border-radius: 0px !important; background: none !important; inset: auto !important; float: none !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; box-sizing: content-box !important; min-height: auto !important;" width="719"><p class="line number1 index0 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><Suspense></code></p><p class="line number2 index1 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><!-- Async component here --></code></p><p class="line number3 index2 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"> </p><p class="line number4 index3 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><template #fallback></code></p><p class="line number5 index4 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><!-- Sync loading state component here --></code></p><p class="line number6 index5 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"></template></code></p><p class="line number7 index6 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"></Suspense></code></p></td></tr></tbody></table><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">为了使用Suspense，把异步组件放入 <code style="margin: 0px; padding: 2px 4px; font-size: 14.4px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px;">default</code> 槽，把回退加载状态放入 <code style="margin: 0px; padding: 2px 4px; font-size: 14.4px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px;">fallback</code> 槽。</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">异步组件是以下两种情况之一:</p><ul style="padding: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; font-size: 14px; white-space: normal; background-color: rgb(255, 255, 255);" class=" list-paddingleft-2"><li><p>一个带有<code style="margin: 0px; padding: 2px 4px; font-size: 14.4px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px;">async setup</code>函数的组件，该组件返回一个Promise，或者在<code style="margin: 0px; padding: 2px 4px; font-size: 14.4px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px;">script setup</code>中使用顶级<code style="margin: 0px; padding: 2px 4px; font-size: 14.4px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px;">await</code></p></li><li><p>使用 <code style="margin: 0px; padding: 2px 4px; font-size: 14.4px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px;">defineAsyncComponent</code> 异步加载的组件</p></li></ul><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">无论哪种方式，我们最终都会得到一个开始未解决 的 Promise ，然后最终得到解决。</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">当该 Promise 未被解决时，Suspense 组件将显示 <code style="margin: 0px; padding: 2px 4px; font-size: 14.4px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px;">fallback</code> 槽中的内容。然后，当Promise 被解决时，它会在 <code style="margin: 0px; padding: 2px 4px; font-size: 14.4px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px;">default</code> 槽中显示该异步组件。</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);"><strong style="margin: 0px; padding: 0px;">注意：</strong> 这里没有错误处理路基。起初我以为有，但这是对悬念的一个常见误解。如果想知道是什么导致了错误。可以使用<code style="margin: 0px; padding: 2px 4px; font-size: 14.4px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px;">onErrorCaptured</code>钩子来捕捉错误，但这是一个独立于Suspense的功能。</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">现在我们对Suspense有了一些了解，让我们回到我们的演示应用程序。</p><h2 style="margin: 0px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);"><strong style="margin: 0px; padding: 0px;">管理异步依赖关系</strong></h2><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">为了让<code style="margin: 0px; padding: 2px 4px; font-size: 14.4px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px;">Suspense</code>管理我们的加载状态，首先需要将<code style="margin: 0px; padding: 2px 4px; font-size: 14.4px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px;">BeforeSuspense</code>组件转换成一个异步组件</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">我们将它命名为 WithSuspense，内容如下：</p><table class="wcn_c_table" cellpadding="0" cellspacing="0" width="760"><tbody style="margin: 0px !important; padding: 0px !important; border-radius: 0px !important; background: none !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><tr style="margin: 0px !important; padding: 0px !important; border-radius: 0px !important; background: none !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;" class="firstRow"><td class="gutter" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); margin: 0px !important; border-radius: 4px 0px 0px 4px !important; background: none !important; inset: auto !important; float: none !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; box-sizing: content-box !important; min-height: auto !important; color: rgb(175, 175, 175) !important; user-select: none !important;" width="NaN"><p class="line number1 index0 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">1</p><p class="line number2 index1 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">2</p><p class="line number3 index2 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">3</p><p class="line number4 index3 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">4</p><p class="line number5 index4 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">5</p><p class="line number6 index5 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">6</p><p class="line number7 index6 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">7</p><p class="line number8 index7 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">8</p><p class="line number9 index8 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">9</p><p class="line number10 index9 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">10</p><p class="line number11 index10 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">11</p><p class="line number12 index11 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">12</p><p class="line number13 index12 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">13</p><p class="line number14 index13 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">14</p><p class="line number15 index14 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">15</p><p class="line number16 index15 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">16</p><p class="line number17 index16 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">17</p><p class="line number18 index17 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">18</p><p class="line number19 index18 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">19</p><p class="line number20 index19 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">20</p><p class="line number21 index20 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">21</p></td><td class="code" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); word-break: break-all; margin: 0px !important; border-radius: 0px !important; background: none !important; inset: auto !important; float: none !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; box-sizing: content-box !important; min-height: auto !important;" width="712"><p class="line number1 index0 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><template></code></p><p class="line number2 index1 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><div </code><code class="php keyword" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; font-weight: bold !important; min-height: auto !important;">class</code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">=</code><code class="php string" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">async-component loaded</code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">></code></p><p class="line number3 index2 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><!-- 这里不需要一个 Spiner 了，因为加载是在根部处理的 --></code></p><p class="line number4 index3 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><slot /></code></p><p class="line number5 index4 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"></div></code></p><p class="line number6 index5 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"></template></code></p><p class="line number7 index6 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"> </p><p class="line number8 index7 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><script setup></code></p><p class="line number9 index8 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php keyword" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; font-weight: bold !important; min-height: auto !important;">const</code> <code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">{ time } = defineProps({</code></p><p class="line number10 index9 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">time: {</code></p><p class="line number11 index10 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">type: Number,</code></p><p class="line number12 index11 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">required: true</code></p><p class="line number13 index12 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">}</code></p><p class="line number14 index13 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">})</code></p><p class="line number15 index14 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php comments" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">// 加入一个延迟，以模拟加载数据</code></p><p class="line number16 index15 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">await </code><code class="php keyword" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; font-weight: bold !important; min-height: auto !important;">new</code> <code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">Promise(resolve => {</code></p><p class="line number17 index16 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">setTimeout(() => {</code></p><p class="line number18 index17 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">resolve()</code></p><p class="line number19 index18 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">}, time)</code></p><p class="line number20 index19 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">})</code></p><p class="line number21 index20 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"></script></code></p></td></tr></tbody></table><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">我们已经完全删除了加载状态的Spinner，因为这个组件不再有加载状态了。</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">因为这是一个异步组件，<code style="margin: 0px; padding: 2px 4px; font-size: 14.4px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px;">setup</code> 函数直到它完成加载才会返回。该组件只有在 setup 函数完成后才会被加载。因此，与<code style="margin: 0px; padding: 2px 4px; font-size: 14.4px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px;">BeforeSuspense</code>组件不同，<code style="margin: 0px; padding: 2px 4px; font-size: 14.4px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px;">WithSuspense</code>组件内容在加载完毕之前不会被渲染。</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">这对任何异步组件来说都是如此，不管它是如何被使用的。在setup函数返回（如果是同步的）或解析（如果是异步的）之前，它不会渲染任何东西。</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">有了<strong style="margin: 0px; padding: 0px;">WithSuspense</strong>组件，我们仍然需要重构我们的<code style="margin: 0px; padding: 2px 4px; font-size: 14.4px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px;">App</code>组件，以便在<code style="margin: 0px; padding: 2px 4px; font-size: 14.4px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px;">Suspens</code>e组件中使用这个组件。</p><table class="wcn_c_table" cellpadding="0" cellspacing="0" width="760"><tbody style="margin: 0px !important; padding: 0px !important; border-radius: 0px !important; background: none !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><tr style="margin: 0px !important; padding: 0px !important; border-radius: 0px !important; background: none !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;" class="firstRow"><td class="gutter" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); margin: 0px !important; border-radius: 4px 0px 0px 4px !important; background: none !important; inset: auto !important; float: none !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; box-sizing: content-box !important; min-height: auto !important; color: rgb(175, 175, 175) !important; user-select: none !important;" width="NaN"><p class="line number1 index0 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">1</p><p class="line number2 index1 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">2</p><p class="line number3 index2 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">3</p><p class="line number4 index3 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">4</p><p class="line number5 index4 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">5</p><p class="line number6 index5 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">6</p><p class="line number7 index6 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">7</p><p class="line number8 index7 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">8</p><p class="line number9 index8 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">9</p><p class="line number10 index9 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">10</p><p class="line number11 index10 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">11</p><p class="line number12 index11 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">12</p><p class="line number13 index12 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">13</p><p class="line number14 index13 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">14</p><p class="line number15 index14 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">15</p><p class="line number16 index15 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">16</p></td><td class="code" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); word-break: break-all; margin: 0px !important; border-radius: 0px !important; background: none !important; inset: auto !important; float: none !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; box-sizing: content-box !important; min-height: auto !important;" width="712"><p class="line number1 index0 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><template></code></p><p class="line number2 index1 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><button @click=</code><code class="php string" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">reload</code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">>Reload page</button></code></p><p class="line number3 index2 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><Suspense></code></p><p class="line number4 index3 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><WithSuspense :time=</code><code class="php string" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">2000</code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">></code></p><p class="line number5 index4 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><WithSuspense :time=</code><code class="php string" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">1500</code> <code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">/></code></p><p class="line number6 index5 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><WithSuspense :time=</code><code class="php string" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">1200</code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">></code></p><p class="line number7 index6 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><WithSuspense :time=</code><code class="php string" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">1000</code> <code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">/></code></p><p class="line number8 index7 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><WithSuspense :time=</code><code class="php string" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">5000</code> <code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">/></code></p><p class="line number9 index8 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"></WithSuspense></code></p><p class="line number10 index9 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"></WithSuspense></code></p><p class="line number11 index10 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"> </p><p class="line number12 index11 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><template #fallback></code></p><p class="line number13 index12 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><Spinner /></code></p><p class="line number14 index13 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"></template></code></p><p class="line number15 index14 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"></Suspense></code></p><p class="line number16 index15 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"></template></code></p></td></tr></tbody></table><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">结构和之前一样，但这次是在 Suspense 组件的默认槽中。我们还加入了 fallback 槽，在加载时渲染我们的Spinner组件。</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">在演示中，你会看到它显示加载按钮，直到所有的组件都加载完毕。只有在那时，它才会显示现在完全加载的组件树。</p><h2 style="margin: 0px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);"><strong style="margin: 0px; padding: 0px;">异步瀑布</strong></h2><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">如果你仔细注意，你会注意到这些组件并不像你想象的那样是并联加载的。</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">总的加载时间不是基于最慢的组件（5秒）。相反，这个时间要长得多。这是因为Vue只有在父异步组件完全解析后才会开始加载子组件。</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">你可以通过把日志放到<code style="margin: 0px; padding: 2px 4px; font-size: 14.4px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px;">WithSuspense组</code>件中来测试这一点。一个在安装开始跟踪安装，一个在我们调用解决之前。</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">最初使用<code style="margin: 0px; padding: 2px 4px; font-size: 14.4px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px;">BeforeSuspense</code>组件的例子中，整个组件树被挂载，无需等待，所有的 异步 操作都是并行启动的。这意味着<code style="margin: 0px; padding: 2px 4px; font-size: 14.4px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px;">Suspense</code>有可能通过引入这种异步瀑布而影响性能。所以请记住这一点。</p><h2 style="margin: 0px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);"><strong style="margin: 0px; padding: 0px;">嵌套 Suspense 以隔离子树</strong></h2><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">事例地址：https://codesandbox.io/s/nesting-suspense-wt0q7k?file=/src/App.vue</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">这里有一个深度嵌套的组件，它需要整整5秒来加载，阻塞了整个UI，尽管大多数组件加载完成的时间要早得多。</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">但对我们来说有一个解决方案</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">通过进一步嵌套第二个Suspense组件，我们可以在等待这个组件完成加载时显示应用程序的其他部分。</p><table class="wcn_c_table" cellpadding="0" cellspacing="0" width="760"><tbody style="margin: 0px !important; padding: 0px !important; border-radius: 0px !important; background: none !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><tr style="margin: 0px !important; padding: 0px !important; border-radius: 0px !important; background: none !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;" class="firstRow"><td class="gutter" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); margin: 0px !important; border-radius: 4px 0px 0px 4px !important; background: none !important; inset: auto !important; float: none !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; box-sizing: content-box !important; min-height: auto !important; color: rgb(175, 175, 175) !important; user-select: none !important;" width="NaN"><p class="line number1 index0 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">1</p><p class="line number2 index1 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">2</p><p class="line number3 index2 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">3</p><p class="line number4 index3 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">4</p><p class="line number5 index4 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">5</p><p class="line number6 index5 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">6</p><p class="line number7 index6 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">7</p><p class="line number8 index7 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">8</p><p class="line number9 index8 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">9</p><p class="line number10 index9 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">10</p><p class="line number11 index10 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">11</p><p class="line number12 index11 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">12</p><p class="line number13 index12 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">13</p><p class="line number14 index13 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">14</p><p class="line number15 index14 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">15</p><p class="line number16 index15 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">16</p><p class="line number17 index16 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">17</p><p class="line number18 index17 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">18</p><p class="line number19 index18 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">19</p><p class="line number20 index19 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">20</p><p class="line number21 index20 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">21</p><p class="line number22 index21 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">22</p><p class="line number23 index22 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">23</p></td><td class="code" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); word-break: break-all; margin: 0px !important; border-radius: 0px !important; background: none !important; inset: auto !important; float: none !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; box-sizing: content-box !important; min-height: auto !important;" width="712"><p class="line number1 index0 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><template></code></p><p class="line number2 index1 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><button @click=</code><code class="php string" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">reload</code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">>Reload page</button></code></p><p class="line number3 index2 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><Suspense></code></p><p class="line number4 index3 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><WithSuspense :time=</code><code class="php string" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">2000</code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">></code></p><p class="line number5 index4 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><WithSuspense :time=</code><code class="php string" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">1500</code> <code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">/></code></p><p class="line number6 index5 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><WithSuspense :time=</code><code class="php string" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">1200</code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">></code></p><p class="line number7 index6 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><WithSuspense :time=</code><code class="php string" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">1000</code> <code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">/></code></p><p class="line number8 index7 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"> </p><p class="line number9 index8 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><!-- Nest a second Suspense component --></code></p><p class="line number10 index9 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><Suspense></code></p><p class="line number11 index10 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><WithSuspense :time=</code><code class="php string" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">5000</code> <code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">/></code></p><p class="line number12 index11 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><template #fallback></code></p><p class="line number13 index12 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><Spinner /></code></p><p class="line number14 index13 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"></template></code></p><p class="line number15 index14 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"></Suspense></code></p><p class="line number16 index15 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"></WithSuspense></code></p><p class="line number17 index16 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"></WithSuspense></code></p><p class="line number18 index17 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"> </p><p class="line number19 index18 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><template #fallback></code></p><p class="line number20 index19 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><Spinner /></code></p><p class="line number21 index20 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"></template></code></p><p class="line number22 index21 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"></Suspense></code></p><p class="line number23 index22 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"></template></code></p></td></tr></tbody></table><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">将其包裹在第二个<code style="margin: 0px; padding: 2px 4px; font-size: 14.4px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px;">Suspense</code>组件中，使其与应用程序的其他部分隔离。Suspense组件本身是一个同步组件，所以当它的父级组件被加载时，它就会被加载。</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">然后它将显示它自己的 fallback 内容，直到5秒结束。</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);"></p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">通过这样做，我们可以隔离应用程序中加载较慢的部分，减少我们的首次交互时间。在某些情况下，这可能是必要的，特别是当你需要避免异步瀑布时。</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">从功能的角度来看，这也是有意义的。你的应用程序的每个功能或 部分都可以被包裹在它自己的<code style="margin: 0px; padding: 2px 4px; font-size: 14.4px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px;">Suspense</code>组件中，所以每个功能的加载都是一个单一的逻辑单元。</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">当然，如果你用 Suspense 包装每一个组成部分，我们就会回到我们开始的地方。我们可以选择以任何最合理的方式来批处理我们的加载状态。</p><h2 style="margin: 0px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);"><strong style="margin: 0px; padding: 0px;">使用占位符的 Suspense</strong></h2><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">事例地址： https://codesandbox.io/s/placeholders-and-suspense-k5uzw0?</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">与其使用单一的 spinner，占位符组件往往可以提供更好的体验。</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);"></p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">这种方式向用户展示将要展示的内容，并让他们在界面渲染前有一种期待的感觉。这是 spinner 无法做到的。</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">可以说--它们很时髦，看起来很酷。因此，我们重构代码，使用占位符方式:</p><table class="wcn_c_table" cellpadding="0" cellspacing="0" width="760"><tbody style="margin: 0px !important; padding: 0px !important; border-radius: 0px !important; background: none !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><tr style="margin: 0px !important; padding: 0px !important; border-radius: 0px !important; background: none !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;" class="firstRow"><td class="gutter" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); margin: 0px !important; border-radius: 4px 0px 0px 4px !important; background: none !important; inset: auto !important; float: none !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; box-sizing: content-box !important; min-height: auto !important; color: rgb(175, 175, 175) !important; user-select: none !important;" width="NaN"><p class="line number1 index0 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">1</p><p class="line number2 index1 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">2</p><p class="line number3 index2 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">3</p><p class="line number4 index3 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">4</p><p class="line number5 index4 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">5</p><p class="line number6 index5 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">6</p><p class="line number7 index6 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">7</p><p class="line number8 index7 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">8</p><p class="line number9 index8 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">9</p><p class="line number10 index9 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">10</p><p class="line number11 index10 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">11</p><p class="line number12 index11 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">12</p><p class="line number13 index12 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">13</p><p class="line number14 index13 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">14</p><p class="line number15 index14 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">15</p><p class="line number16 index15 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">16</p><p class="line number17 index16 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">17</p><p class="line number18 index17 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">18</p><p class="line number19 index18 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">19</p><p class="line number20 index19 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">20</p><p class="line number21 index20 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">21</p><p class="line number22 index21 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">22</p><p class="line number23 index22 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">23</p><p class="line number24 index23 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">24</p><p class="line number25 index24 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">25</p><p class="line number26 index25 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">26</p><p class="line number27 index26 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">27</p><p class="line number28 index27 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">28</p></td><td class="code" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); word-break: break-all; margin: 0px !important; border-radius: 0px !important; background: none !important; inset: auto !important; float: none !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; box-sizing: content-box !important; min-height: auto !important;" width="712"><p class="line number1 index0 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><template></code></p><p class="line number2 index1 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><button @click=</code><code class="php string" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">reload</code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">>Reload page</button></code></p><p class="line number3 index2 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><Suspense></code></p><p class="line number4 index3 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><WithSuspense :time=</code><code class="php string" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">2000</code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">></code></p><p class="line number5 index4 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><WithSuspense :time=</code><code class="php string" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">1500</code> <code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">/></code></p><p class="line number6 index5 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><WithSuspense :time=</code><code class="php string" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">1200</code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">></code></p><p class="line number7 index6 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><WithSuspense :time=</code><code class="php string" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">1000</code> <code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">/></code></p><p class="line number8 index7 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"> </p><p class="line number9 index8 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><Suspense></code></p><p class="line number10 index9 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><WithSuspense :time=</code><code class="php string" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">5000</code> <code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">/></code></p><p class="line number11 index10 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><template #fallback></code></p><p class="line number12 index11 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><Placeholder /></code></p><p class="line number13 index12 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"></template></code></p><p class="line number14 index13 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"></Suspense></code></p><p class="line number15 index14 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"></WithSuspense></code></p><p class="line number16 index15 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"></WithSuspense></code></p><p class="line number17 index16 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><template #fallback></code></p><p class="line number18 index17 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><!-- 这里，复制实际数据的形状 --></code></p><p class="line number19 index18 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><Placeholder></code></p><p class="line number20 index19 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><Placeholder /></code></p><p class="line number21 index20 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><Placeholder></code></p><p class="line number22 index21 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><Placeholder /></code></p><p class="line number23 index22 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><Placeholder /></code></p><p class="line number24 index23 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"></Placeholder></code></p><p class="line number25 index24 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"></Placeholder></code></p><p class="line number26 index25 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"></template></code></p><p class="line number27 index26 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"></Suspense></code></p><p class="line number28 index27 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"></template></code></p></td></tr></tbody></table><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">我们安排了这些Placeholder组件，并对它们进行了风格化处理，使它们看起来与<code style="margin: 0px; padding: 2px 4px; font-size: 14.4px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px;">WithSuspense</code>组件完全一样。这提供了一个在加载和装载状态之间的无缝过渡。</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">在演示中，<code style="margin: 0px; padding: 2px 4px; font-size: 14.4px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px;">Placeholder</code>组件在背景上给我们提供了一个CSS动画，以创造一个脉动的效果:</p><table class="wcn_c_table" cellpadding="0" cellspacing="0" width="760"><tbody style="margin: 0px !important; padding: 0px !important; border-radius: 0px !important; background: none !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"><tr style="margin: 0px !important; padding: 0px !important; border-radius: 0px !important; background: none !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;" class="firstRow"><td class="gutter" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); margin: 0px !important; border-radius: 4px 0px 0px 4px !important; background: none !important; inset: auto !important; float: none !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; box-sizing: content-box !important; min-height: auto !important; color: rgb(175, 175, 175) !important; user-select: none !important;" width="NaN"><p class="line number1 index0 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">1</p><p class="line number2 index1 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">2</p><p class="line number3 index2 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">3</p><p class="line number4 index3 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">4</p><p class="line number5 index4 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">5</p><p class="line number6 index5 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">6</p><p class="line number7 index6 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">7</p><p class="line number8 index7 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">8</p><p class="line number9 index8 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">9</p><p class="line number10 index9 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">10</p><p class="line number11 index10 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">11</p><p class="line number12 index11 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">12</p><p class="line number13 index12 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">13</p><p class="line number14 index13 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">14</p><p class="line number15 index14 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">15</p><p class="line number16 index15 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">16</p><p class="line number17 index16 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">17</p><p class="line number18 index17 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">18</p><p class="line number19 index18 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">19</p><p class="line number20 index19 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">20</p><p class="line number21 index20 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 0.5em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important; text-align: right !important;">21</p></td><td class="code" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); word-break: break-all; margin: 0px !important; border-radius: 0px !important; background: none !important; inset: auto !important; float: none !important; line-height: 1.1em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; box-sizing: content-box !important; min-height: auto !important;" width="712"><p class="line number1 index0 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">.fast-gradient {</code></p><p class="line number2 index1 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">background: linear-gradient(</code></p><p class="line number3 index2 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">to right,</code></p><p class="line number4 index3 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">rgba(255, 255, 255, 0.1),</code></p><p class="line number5 index4 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">rgba(255, 255, 255, 0.4)</code></p><p class="line number6 index5 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">);</code></p><p class="line number7 index6 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">background-size: 200% 200%;</code></p><p class="line number8 index7 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">animation: gradient 2s ease-in-out infinite;</code></p><p class="line number9 index8 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">}</code></p><p class="line number10 index9 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"> </p><p class="line number11 index10 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">@keyframes gradient {</code></p><p class="line number12 index11 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">0% {</code></p><p class="line number13 index12 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">background-position: 0% 50%;</code></p><p class="line number14 index13 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">}</code></p><p class="line number15 index14 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">50% {</code></p><p class="line number16 index15 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">background-position: 100% 50%;</code></p><p class="line number17 index16 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">}</code></p><p class="line number18 index17 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">100% {</code></p><p class="line number19 index18 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">background-position: 0% 50%;</code></p><p class="line number20 index19 alt1" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php spaces" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;"> </code><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">}</code></p><p class="line number21 index20 alt2" style="margin-top: 15px; margin-bottom: 15px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 1.5em; border-radius: 8px; font-size: 16px; color: rgb(61, 70, 77); box-sizing: border-box; padding-right: 1em !important; padding-left: 1em !important; border-left: 3px solid rgb(67, 90, 95) !important; white-space: pre-wrap !important;"><code class="php plain" style="padding: 2px 4px; font-size: 13px; color: rgb(199, 37, 78); background-color: rgb(249, 242, 244); border-radius: 4px; font-family: Monaco, Menlo, Consolas, Courier New, monospace; margin: 0px !important; background-image: none !important; background-position: initial !important; background-size: initial !important; background-repeat: initial !important; background-attachment: initial !important; background-origin: initial !important; background-clip: initial !important; border: 0px !important; inset: auto !important; float: none !important; line-height: 1.5em !important; outline: 0px !important; overflow: visible !important; position: static !important; vertical-align: baseline !important; width: auto !important; box-sizing: content-box !important; min-height: auto !important;">}</code></p></td></tr></tbody></table><h2 style="margin: 0px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);"><strong style="margin: 0px; padding: 0px;">总结</strong></h2><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">爆米花的加载状态是非常明显的，会伤害用户体验。</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">幸运的是，Suspense 是一个很棒的新特性，它为我们在Vue应用程序中协调加载状态提供了很多选择。</p><p style="margin-top: 15px; margin-bottom: 15px; padding: 0px 0px 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: rgb(61, 70, 77); box-sizing: border-box; border-radius: 8px; font-family: Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif; white-space: normal; background-color: rgb(255, 255, 255);">然而，在写这篇文章的时候，Suspense仍然被认为是实验性的，所以要谨慎行事。关于它的状态的最新信息，请参考文档。</p><p><br/></p><link rel="stylesheet" href="//www.zhidianyun.cn/source/plugin/wcn_editor/public/wcn_editor_fit.css?v134_TZ8" id="wcn_editor_css"/>
页:
[1]