Skip to main content
Usa el componente <MDX> para renderizar sus elementos hijos como MDX. El contenido entre las etiquetas se compila como el resto de tu página: encabezados, bloques de código, tablas y otros componentes funcionan. El componente es más útil dentro de expresiones {...}. El Markdown dentro de una expresión normalmente se renderiza como texto JSX sin formato. Envuélvelo en <MDX> para mantener el renderizado completo de Markdown mientras muestras contenido de forma condicional.

Ejemplo

Muestra diferentes secciones de Markdown según una variable exportada:
Conditional Markdown
Solo la rama activa se renderiza en la página. También puedes usar <MDX> en el nivel superior de una página para agrupar una sección de Markdown en un solo elemento:
Block form
Deja una línea en blanco después de la etiqueta de apertura en la forma de bloque para que el contenido se analice como Markdown a nivel de bloque. Dentro de expresiones, <MDX> elimina la sangría inicial común de su contenido, por lo que puedes sangrarlo para que coincida con el código circundante.
Los encabezados dentro de <MDX> no aparecen en la tabla de contenido de la página.

Límites

  • Puedes anidar componentes <MDX> hasta 8 niveles de profundidad.
  • Una página puede expandir hasta 500 fragmentos <MDX> dentro de expresiones.
Superar cualquiera de los dos límites hace fallar la compilación.