{
  "url": "https://unifast.dev/vi/docs/packages/core/hast-to-html/",
  "locale": "vi",
  "title": "hastToHtml()",
  "description": "Tuần tự hóa một nút gốc HAST thành chuỗi HTML.",
  "section": "packages",
  "body": "```ts\nimport { hastToHtml } from \"@unifast/core\";\n```\n\n## Chữ ký\n\n```ts\nfunction hastToHtml(hast: HastRoot): string\n```\n\n## Tham số\n\n### hast\n\n| Thuộc tính | Kiểu | Mặc định | Mô tả |\n|----------|------|---------|-------------|\n| `type` | `\"root\"` | — | Định danh loại nút |\n| `children` | `HastNode[]` | — | Các nút con của cây |\n\n## Giá trị trả về\n\n`string` — Chuỗi HTML đã được tuần tự hóa.\n\n## Cách dùng\n\n```ts\nimport { hastToHtml } from \"@unifast/core\";\nimport type { HastRoot } from \"@unifast/core\";\n\nconst hast: HastRoot = {\n  type: \"root\",\n  children: [\n    {\n      type: \"element\",\n      tagName: \"h1\",\n      properties: { id: \"hello\", className: [\"title\", \"main\"] },\n      children: [\n        { type: \"text\", value: \"Hello \" },\n        {\n          type: \"element\",\n          tagName: \"strong\",\n          properties: {},\n          children: [{ type: \"text\", value: \"world\" }],\n        },\n      ],\n    },\n  ],\n};\n\nconst html = hastToHtml(hast);\n\nconsole.log(html);\n// <h1 class=\"title main\" id=\"hello\">Hello <strong>world</strong></h1>\n```\n\n## Ví dụ\n\n### Tuần tự hóa cơ bản\n\n```ts\nimport { hastToHtml } from \"@unifast/core\";\nimport type { HastRoot } from \"@unifast/core\";\n\nconst hast: HastRoot = {\n  type: \"root\",\n  children: [\n    {\n      type: \"element\",\n      tagName: \"p\",\n      properties: {},\n      children: [\n        { type: \"text\", value: \"This is \" },\n        {\n          type: \"element\",\n          tagName: \"strong\",\n          properties: {},\n          children: [{ type: \"text\", value: \"bold\" }],\n        },\n        { type: \"text\", value: \" text.\" },\n      ],\n    },\n  ],\n};\n\nconsole.log(hastToHtml(hast));\n// <p>This is <strong>bold</strong> text.</p>\n```\n\n### Phần tử void\n\nCác phần tử void (`<br>`, `<img>`, `<hr>`, v.v.) được tự động tự đóng:\n\n```ts\nimport { hastToHtml } from \"@unifast/core\";\nimport type { HastRoot } from \"@unifast/core\";\n\nconst hast: HastRoot = {\n  type: \"root\",\n  children: [\n    {\n      type: \"element\",\n      tagName: \"img\",\n      properties: { src: \"photo.jpg\", alt: \"A photo\" },\n      children: [],\n    },\n  ],\n};\n\nconsole.log(hastToHtml(hast));\n// <img alt=\"A photo\" src=\"photo.jpg\" />\n```\n\n### Kết hợp với đầu ra của compile()\n\n```ts\nimport { compile } from \"@unifast/node\";\nimport { hastToHtml } from \"@unifast/core\";\nimport type { HastRoot } from \"@unifast/core\";\n\nconst result = compile(\"**bold text**\", { outputKind: \"hast\" });\nconst hast: HastRoot = JSON.parse(result.output as string);\n\nconsole.log(hastToHtml(hast));\n// <p><strong>bold text</strong></p>\n```\n\n### HTML thô đi qua không xử lý\n\n```ts\nimport { hastToHtml } from \"@unifast/core\";\nimport type { HastRoot } from \"@unifast/core\";\n\nconst hast: HastRoot = {\n  type: \"root\",\n  children: [\n    { type: \"raw\", value: \"<div class=\\\"custom\\\">Raw HTML</div>\" },\n  ],\n};\n\nconsole.log(hastToHtml(hast));\n// <div class=\"custom\">Raw HTML</div>\n```\n\n## Hành vi\n\n- **Escape HTML:** Nội dung văn bản được escape (`&`, `<`, `>`, `\"`)\n- **Phần tử void:** `area`, `base`, `br`, `col`, `embed`, `hr`, `img`, `input`, `link`, `meta`, `param`, `source`, `track`, `wbr` được tự đóng\n- **Thuộc tính:** Được sắp xếp theo thứ tự bảng chữ cái; mảng `className` được nối bằng dấu cách và render thành `class`; thuộc tính boolean `true` render dưới dạng thuộc tính trần; `false`/`null`/`undefined` bị bỏ qua\n- **Comment:** Render thành `<!--value-->`\n- **Doctype:** Render thành `<!DOCTYPE html>`\n- **Nút raw:** Xuất ra nguyên trạng, không escape",
  "alternates": [
    {
      "locale": "en",
      "url": "https://unifast.dev/docs/packages/core/hast-to-html/",
      "api": "https://unifast.dev//api/docs/packages/core/hast-to-html.json"
    },
    {
      "locale": "ja",
      "url": "https://unifast.dev/ja/docs/packages/core/hast-to-html/",
      "api": "https://unifast.dev//api/ja/docs/packages/core/hast-to-html.json"
    },
    {
      "locale": "zh-CN",
      "url": "https://unifast.dev/zh-CN/docs/packages/core/hast-to-html/",
      "api": "https://unifast.dev//api/zh-CN/docs/packages/core/hast-to-html.json"
    },
    {
      "locale": "zh-TW",
      "url": "https://unifast.dev/zh-TW/docs/packages/core/hast-to-html/",
      "api": "https://unifast.dev//api/zh-TW/docs/packages/core/hast-to-html.json"
    },
    {
      "locale": "ko",
      "url": "https://unifast.dev/ko/docs/packages/core/hast-to-html/",
      "api": "https://unifast.dev//api/ko/docs/packages/core/hast-to-html.json"
    },
    {
      "locale": "fr",
      "url": "https://unifast.dev/fr/docs/packages/core/hast-to-html/",
      "api": "https://unifast.dev//api/fr/docs/packages/core/hast-to-html.json"
    },
    {
      "locale": "it",
      "url": "https://unifast.dev/it/docs/packages/core/hast-to-html/",
      "api": "https://unifast.dev//api/it/docs/packages/core/hast-to-html.json"
    },
    {
      "locale": "es",
      "url": "https://unifast.dev/es/docs/packages/core/hast-to-html/",
      "api": "https://unifast.dev//api/es/docs/packages/core/hast-to-html.json"
    },
    {
      "locale": "pt-BR",
      "url": "https://unifast.dev/pt-BR/docs/packages/core/hast-to-html/",
      "api": "https://unifast.dev//api/pt-BR/docs/packages/core/hast-to-html.json"
    },
    {
      "locale": "de",
      "url": "https://unifast.dev/de/docs/packages/core/hast-to-html/",
      "api": "https://unifast.dev//api/de/docs/packages/core/hast-to-html.json"
    },
    {
      "locale": "ru",
      "url": "https://unifast.dev/ru/docs/packages/core/hast-to-html/",
      "api": "https://unifast.dev//api/ru/docs/packages/core/hast-to-html.json"
    },
    {
      "locale": "hi",
      "url": "https://unifast.dev/hi/docs/packages/core/hast-to-html/",
      "api": "https://unifast.dev//api/hi/docs/packages/core/hast-to-html.json"
    },
    {
      "locale": "id",
      "url": "https://unifast.dev/id/docs/packages/core/hast-to-html/",
      "api": "https://unifast.dev//api/id/docs/packages/core/hast-to-html.json"
    },
    {
      "locale": "tr",
      "url": "https://unifast.dev/tr/docs/packages/core/hast-to-html/",
      "api": "https://unifast.dev//api/tr/docs/packages/core/hast-to-html.json"
    },
    {
      "locale": "vi",
      "url": "https://unifast.dev/vi/docs/packages/core/hast-to-html/",
      "api": "https://unifast.dev//api/vi/docs/packages/core/hast-to-html.json"
    }
  ]
}
