diff --git a/components/view.mdx b/components/view.mdx index 4c4969bdf..ab3585a13 100644 --- a/components/view.mdx +++ b/components/view.mdx @@ -52,12 +52,32 @@ The table of contents automatically updates to show only the headings for the cu If you have different heading structures in each view, users only see the headings that are relevant to their selected language or framework. +## Deep linking + +Each `View` automatically gets a URL-friendly anchor ID derived from its `title`. When a URL contains a hash that matches a view's ID (or the ID of a heading or accordion inside that view), the correct view activates automatically and the page scrolls to the target element. + +For example, with ``, visiting `#api-settings` activates that view. Switching views via the dropdown also updates the URL hash, so you can share links that open a specific view. + +Use the `id` property to set a custom anchor instead of the auto-generated one: + +```mdx + + ... + +``` + +This view is reachable at `#settings` instead of the auto-generated `#api-settings`. See [Linking](/guides/linking#view-deep-links) for more on deep linking. + ## Properties The title that identifies this view. Must match one of the options in the multi-view dropdown. + + A custom anchor ID for deep linking. Defaults to a slugified version of the `title`. + + A [Font Awesome](https://fontawesome.com/icons) icon, [Lucide](https://lucide.dev/icons) icon, URL to an icon, or relative path to an icon. diff --git a/es/components/view.mdx b/es/components/view.mdx index 27a80a6a6..4b2810e6d 100644 --- a/es/components/view.mdx +++ b/es/components/view.mdx @@ -56,6 +56,24 @@ La tabla de contenidos se actualiza automáticamente para mostrar solo los encab Si tienes estructuras de encabezados diferentes en cada vista, los usuarios solo verán los encabezados que sean relevantes para el idioma o framework que hayan seleccionado. +
+ ## Enlaces profundos +
+ +Cada `View` obtiene automáticamente un ID de anclaje compatible con URL, derivado de su `title`. Cuando una URL contiene un hash que coincide con el ID de una vista (o con el ID de un encabezado o acordeón dentro de esa vista), la vista correcta se activa automáticamente y la página se desplaza hasta el elemento objetivo. + +Por ejemplo, con ``, visitar `#api-settings` activa esa vista. Cambiar de vista mediante el menú desplegable también actualiza el hash de la URL, por lo que puedes compartir enlaces que abran una vista específica. + +Usa la propiedad `id` para establecer un anclaje personalizado en lugar del generado automáticamente: + +```mdx + + ... + +``` + +Esta vista es accesible en `#settings` en lugar del `#api-settings` generado automáticamente. Consulta [Enlaces](/es/guides/linking#view-deep-links) para más información sobre enlaces profundos. +
## Propiedades
@@ -64,6 +82,10 @@ Si tienes estructuras de encabezados diferentes en cada vista, los usuarios solo El título que identifica esta vista. Debe coincidir con una de las opciones del menú desplegable de vistas múltiples. + + Un ID de anclaje personalizado para enlaces profundos. Por defecto, una versión slugificada del `title`. + + Un icono de [Font Awesome](https://fontawesome.com/icons), un icono de [Lucide](https://lucide.dev/icons), una URL de un icono o una ruta relativa a un icono. diff --git a/es/guides/linking.mdx b/es/guides/linking.mdx index c7ecb987f..1ebb91f40 100644 --- a/es/guides/linking.mdx +++ b/es/guides/linking.mdx @@ -100,6 +100,22 @@ Por defecto, el hash se deriva del `title` del acordeón. Usa la propiedad `id` Este acordeón es accesible en `#install` en lugar del `#installation-steps` generado automáticamente. Consulta [Acordeones](/es/components/accordions) para más información. + + +Cada componente [View](/es/components/view) obtiene automáticamente un ID de anclaje compatible con URL, derivado de su `title`. Visitar una URL con un hash que coincida con el ID de una vista activa esa vista. Si el hash coincide con un encabezado o acordeón dentro de una vista, la vista que contiene ese elemento se activa y la página se desplaza hasta el elemento objetivo. + +Cambiar de vista mediante el menú desplegable también actualiza el hash de la URL, creando enlaces compartibles. Usa la propiedad `id` para establecer un anclaje personalizado: + +```mdx + + ... + +``` + +Esta vista es accesible en `#settings` en lugar del `#api-settings` generado automáticamente. Consulta [Vista](/es/components/view#deep-linking) para más detalles. + diff --git a/fr/components/view.mdx b/fr/components/view.mdx index 07e624145..e0d4c24d6 100644 --- a/fr/components/view.mdx +++ b/fr/components/view.mdx @@ -56,12 +56,42 @@ La table des matières se met à jour automatiquement pour n’afficher que les Si vous avez des structures de titres différentes dans chaque vue, les utilisateurs ne voient que les titres pertinents pour la langue ou le framework qu’ils ont sélectionné. +
+ ## Liens profonds +
+ +Chaque `View` obtient automatiquement un ID d'ancrage compatible avec les URL, dérivé de son `title`. Lorsqu'une URL contient un hash correspondant à l'ID d'une vue (ou à l'ID d'un titre ou d'un accordéon à l'intérieur de cette vue), la vue correcte s'active automatiquement et la page défile jusqu'à l'élément cible. + +Par exemple, avec ``, visiter `#api-settings` active cette vue. Le changement de vue via le menu déroulant met également à jour le hash de l'URL, ce qui permet de partager des liens qui ouvrent une vue spécifique. + +Utilisez la propriété `id` pour définir un ancrage personnalisé au lieu de celui généré automatiquement : + +```mdx + + ... + +``` + +Cette vue est accessible à `#settings` au lieu du `#api-settings` généré automatiquement. Consultez [Liens](/fr/guides/linking#view-deep-links) pour en savoir plus sur les liens profonds. +
## Propriétés
- Le titre qui identifie cette vue. Doit correspondre à l’une des options du menu déroulant multi‑vue. + Le titre qui identifie cette vue. Doit correspondre à l'une des options du menu déroulant multi‑vue. + + + + Un ID d'ancrage personnalisé pour les liens profonds. Par défaut, une version slugifiée du `title`. + + + + Une icône [Font Awesome](https://fontawesome.com/icons), une icône [Lucide](https://lucide.dev/icons), une URL d'icône, ou un chemin relatif vers une icône. + + + + Pour les icônes Font Awesome uniquement : l'une de `regular`, `solid`, `light`, `thin`, `sharp-solid`, `duotone`, `brands`. diff --git a/fr/guides/linking.mdx b/fr/guides/linking.mdx index a5d7dd5e4..3daac17b8 100644 --- a/fr/guides/linking.mdx +++ b/fr/guides/linking.mdx @@ -100,6 +100,22 @@ Par défaut, le hash est dérivé du `title` de l'accordéon. Utilisez la propri Cet accordéon est accessible à `#install` au lieu du `#installation-steps` généré automatiquement. Consultez [Accordéons](/fr/components/accordions) pour en savoir plus. + + +Chaque composant [View](/fr/components/view) obtient automatiquement un ID d'ancrage compatible avec les URL, dérivé de son `title`. Visiter une URL avec un hash correspondant à l'ID d'une vue active cette vue. Si le hash correspond à un titre ou un accordéon à l'intérieur d'une vue, la vue contenant cet élément s'active et la page défile jusqu'à l'élément cible. + +Le changement de vue via le menu déroulant met également à jour le hash de l'URL, créant des liens partageables. Utilisez la propriété `id` pour définir un ancrage personnalisé : + +```mdx + + ... + +``` + +Cette vue est accessible à `#settings` au lieu du `#api-settings` généré automatiquement. Consultez [Vue](/fr/components/view#deep-linking) pour plus de détails. + diff --git a/guides/linking.mdx b/guides/linking.mdx index 3b688caef..15dd5cd64 100644 --- a/guides/linking.mdx +++ b/guides/linking.mdx @@ -84,6 +84,20 @@ By default, the hash derives from the accordion's `title`. Use the `id` property This accordion is reachable at `#install` instead of the auto-generated `#installation-steps`. See [Accordions](/components/accordions) for more. +### View deep links + +Each [View](/components/view) component automatically gets a URL-friendly anchor ID derived from its `title`. Visiting a URL with a hash that matches a view's ID activates that view. If the hash matches a heading or accordion inside a view, the containing view activates and the page scrolls to the target element. + +Switching views via the dropdown also updates the URL hash, creating shareable links. Use the `id` property to set a custom anchor: + +```mdx + + ... + +``` + +This view is reachable at `#settings` instead of the auto-generated `#api-settings`. See [View](/components/view#deep-linking) for more details. + ### API playground deep links To open the API playground in a link, append `?playground=open` to any endpoint page URL: diff --git a/zh/components/view.mdx b/zh/components/view.mdx index 9ccfa906c..b70132e69 100644 --- a/zh/components/view.mdx +++ b/zh/components/view.mdx @@ -56,6 +56,24 @@ keywords: ["选择器", "特定语言内容", "内容切换"] 如果每个视图中的标题结构不同，用户只会看到与其所选语言或框架相关的标题。 +
+ ## 深层链接 +
+ +每个 `View` 会根据其 `title` 自动获得一个 URL 友好的锚点 ID。当 URL 包含与视图 ID（或视图内标题、手风琴的 ID）匹配的哈希时，正确的视图会自动激活，并且页面会滚动到目标元素。 + +例如，使用 `` 时，访问 `#api-settings` 会激活该视图。通过下拉菜单切换视图也会更新 URL 哈希，因此你可以分享打开特定视图的链接。 + +使用 `id` 属性设置自定义锚点，而不是自动生成的锚点： + +```mdx + + ... + +``` + +此视图可通过 `#settings` 访问，而不是自动生成的 `#api-settings`。详情请参阅[链接](/zh/guides/linking#view-deep-links)了解更多深层链接信息。 +
## 属性
@@ -64,6 +82,10 @@ keywords: ["选择器", "特定语言内容", "内容切换"] 用于标识此视图的标题。必须与多视图下拉菜单中的某个选项一致。 + + 用于深层链接的自定义锚点 ID。默认为 `title` 的 slug 化版本。 + + 一个 [Font Awesome](https://fontawesome.com/icons) icon、[Lucide](https://lucide.dev/icons) icon、指向 icon 的 URL，或指向 icon 的相对路径。 diff --git a/zh/guides/linking.mdx b/zh/guides/linking.mdx index 82c0cc246..409746225 100644 --- a/zh/guides/linking.mdx +++ b/zh/guides/linking.mdx @@ -100,6 +100,22 @@ Mintlify 通过将标题文本转换为小写、用连字符替换空格并删 此手风琴可通过 `#install` 访问，而不是自动生成的 `#installation-steps`。详情请参阅[手风琴](/zh/components/accordions)。 + + +每个 [View](/zh/components/view) 组件会根据其 `title` 自动获得一个 URL 友好的锚点 ID。访问带有与视图 ID 匹配的哈希的 URL 会激活该视图。如果哈希与视图内的标题或手风琴匹配，则包含该元素的视图会激活，并且页面会滚动到目标元素。 + +通过下拉菜单切换视图也会更新 URL 哈希，从而创建可分享的链接。使用 `id` 属性设置自定义锚点： + +```mdx + + ... + +``` + +此视图可通过 `#settings` 访问，而不是自动生成的 `#api-settings`。详情请参阅[视图](/zh/components/view#deep-linking)。 +