广泛的）不同的场景假设我们正在制作

[account_disabled]

一个徒步跟踪应用程序，其仪表板显示徒步统计信息列表：攀爬的海拔、徒步的步道数量、行走的步数等。对于一直在应用程序中输入内容的活跃用户，UI 可能如下所示： 这是一个虚构的徒步跟踪应用程序的假设仪表板。 Pattern Lab 将默认数据替换为特定于页面的数据，以展示用户登录后可能看到的内容。 这是一个虚构的徒步跟踪应用程序的假设仪表板。将默认数据替换为特定于页面的数据，以展示用户登录后可能看到的内容。（大预览） 在 中我们的数据看起来像这样：复制 有了这些数据，Pattern Lab 就能够用该用户生成的丰富内容来填充 UI。 然而，这种情况可能并不常见。对于每个花时间填充每个字段并连接每个可用应用程序的雄心勃勃的用户来说，可能有数十个临时用户不会填写每个空白并利用应用程序的所有功能。就此而言，在每个用户的旅程中的某个时刻，他们对。

界面都是全新的！让我们使用 Pattern Lab 的伪模式功能来阐明这些重要的变化。 在我们的/目录中，我们可以创建一个名为 的新伪模式。这将创建页面的另一个实例，该实例继承 的所有数据dashboard.json，但也允许我们进一步修改或扩展数据。在 的情况下d，我们可以 Whatsapp 号码列表 覆盖数据位来演示新的用户体验可能是什么样子： （大预览） 以下是我们添加到文件中以完成此 UI 的数据：复制 通过覆盖其中的一些值，dashboard.json我们可以修改内容并打开/关闭特定模式。 在另一种情况下，我们可能需要演示当用户帐户存在安全问题或其他问题时 UI 的外观。我们可以创建n伪模式来创建以下 UI： （大预览） 大多数数据dashboard.json将保持不变，但我们将添加以下内容来创建错误消息：制 模式参数 有时，使用模式实验室需要完整的伪模式，如上所示。但有时您可能只需要调整或覆盖模式中的单个数据值，而让其他动态显。



示模式处理其余数据。对于这些情况，模式参数是您选择的工具。模式参数是一种用于替换所包含模式中的变量的简单机制。它们仅限于替换包含的模式中的变量并且仅替换包含的模式。考虑详细模板的以下摘录： 复制 据我们所知对于 数据块都将从任何存在的配套.json 中填充，并 复制 这两个生物现在将在渲染时使用sctionTitle此处定义的变量。模式参数功能强大，但仅受 PHP 和支持。其他模板语言为这个问题提供了更好的解决方案。查看文档以阅读完整的参数参数。 样式修饰符 通常，您会发现自己希望显示相同模式的风格变体，例如彩色社交媒体按钮或组件状态。速记包含语法的扩展，styleModifiers为模式提供附加类。假设您block-media使用{{ styleModifier}}class 属性构造一个模式： 复制 在伪模式、模式参数和 之，Pattern Lab 可以更轻松地演示有时截然不同的 UI 变化，同时在此。