Grupos de código - Mintlify

Usa el componente CodeGroup para mostrar varios bloques de código en una interfaz con pestañas, lo que permite a los usuarios comparar implementaciones en distintos lenguajes de programación o ver enfoques alternativos para la misma tarea.

console.log("Hello World");

print('Hello World!')

class HelloWorld {
    public static void main(String[] args) {
        System.out.println("Hello, World!");
    }
}

Los grupos de código heredan el estilo global de tu archivo docs.json. Personaliza tu tema con styling.codeblocks. Consulta Settings para ver las opciones de configuración.

Creación de grupos de código

Para crear un grupo de código, envuelve varios bloques de código con las etiquetas <CodeGroup>. Cada bloque de código debe incluir un título, que será la etiqueta de la pestaña.

<CodeGroup>

```javascript helloWorld.js
console.log("Hola Mundo");
```

```python hello_world.py
print('¡Hola Mundo!')
```

```java HelloWorld.java
class HelloWorld {
    public static void main(String[] args) {
        System.out.println("¡Hola, Mundo!");
    }
}
```

</CodeGroup>

Puedes reemplazar las pestañas de un grupo de código por un menú desplegable para alternar entre idiomas usando la prop dropdown.

helloWorld.js

console.log("Hello World");

<CodeGroup dropdown>

```javascript helloWorld.js
console.log("Hola Mundo");
```

```python hello_world.py
print('¡Hola Mundo!')
```

```java HelloWorld.java
class HelloWorld {
    public static void main(String[] args) {
        System.out.println("¡Hola, Mundo!");
    }
}
```
</CodeGroup>

⌘I