Skip to content
Mintlify
Mintlify
组件

视图

使用 view 组件为不同编程语言、框架或配置方案创建可切换的内容面板。

使用 View 组件来创建会根据多视图下拉菜单中所选视图而变化的内容。这对于展示面向不同编程语言或框架的代码示例或特定文档特别有用。

Mintlify 会根据页面上每个 View 组件的 title 自动生成多视图下拉菜单。你无需单独配置下拉菜单。每个页面中每个标题只使用一个 View:重复的标题会被忽略,没有标题的 View 永远不会被渲染。

每种语言在每个页面上只使用一个 View 组件。对于因语言不同而步骤不同的操作流程,请使用 tabs;对于因语言不同而代码不同的示例,请使用 code groups

只有在选择 JavaScript 时才会显示此内容。

console.log("Hello from JavaScript!");
JavaScript and Python views
<View title="JavaScript" icon="js">
  仅在选择 JavaScript 时显示此内容。

  ```javascript
  console.log("Hello from JavaScript!");
  ```
</View>

<View title="Python" icon="python">
  仅在选择 Python 时显示此内容。

  ```python
  print("Hello from Python!")
  ```
</View>

目录会自动更新,仅显示当前选中的视图中的标题。当你使用多视图下拉菜单在不同视图之间切换时,目录会刷新为该视图显示相应的标题。

如果每个视图中的标题结构不同,用户只会看到与其所选语言或框架相关的标题。

titlestringrequired

用于标识此视图的标题。页面上每个唯一的标题都会成为多视图下拉菜单中的一个选项。

iconstring

一个 Font AwesomeLucideTabler icon、单个 emoji、指向 icon 的 URL,或指向 icon 的相对路径。

iconTypestring

仅用于 Font Awesome 图标:取值为 regularsolidlightthinsharp-solidduotonebrands 之一。

classNamestring

应用于视图容器的额外 CSS 类。

Was this page helpful?Suggest editsRaise issue