Total:
``` Sustituye `book` y `sheet` por IDs reales y autorizados y carga la plantilla mediante Renderer. Las fórmulas se definen en Sheet y la página lee sus resultados. Los controles de texto, número, rango, casilla, textarea y selección única se enlazan según sus tipos. ## Ampliar gráficos e interacción con JavaScript El runtime proporciona `window.univerBinding` antes de ejecutar los scripts. Declara un rango de gráfico con `data-univer-range-subscribe` y usa `subscribeRangeById(elementId, callback)` para recibir la matriz y actualizarlo. Los componentes de un valor usan `subscribeCellById()`. `getCellState()` / `getRangeState()` realizan lecturas puntuales; `setCellValue()` escribe escalares e `insertRowsWithValues()` inserta filas con valores. Las suscripciones entregan el estado actual y luego los cambios reales. Las ediciones locales, la colaboración y los resultados de fórmulas aplicados pueden actualizarlas. Las referencias usan coordenadas fijas y no siguen al registro original al insertar o eliminar filas o columnas. Escribir un escalar sustituye fórmulas o texto enriquecido: enlaza las celdas de entrada del negocio. ## Conectar el host y el Agent La aplicación proporciona contenedor, HTML y `loadEngine`. El cargador autoriza la Unit, configura colaboración y devuelve un Engine cargado. Renderer gestiona la página aislada, los mensajes y el ciclo de vida de los Engines entregados. Esta función recibe las tres entradas: ```ts import { renderHtmlView, type RenderHtmlViewOptions, } from '@univerjs-labs/html-view-renderer/render'; export function createPreview( container: HTMLElement, html: string, loadEngine: RenderHtmlViewOptions['loadEngine'], ) { return renderHtmlView({ container, html, loadEngine }); } ``` La aplicación gestiona generación de plantillas, edición de código, almacenamiento y navegación. Un Agent puede generar HTML con declaraciones que reutilizan datos y fórmulas de Sheet. `view.inspect.open()` muestra las relaciones Unit → Sheet → referencia → elemento. Las credenciales quedan en el host y el servidor valida el acceso. Mantén la UI de Sheet y Headless Engine en entornos JavaScript distintos, como páginas o iframes separados. Los paquetes actuales se centran en Sheet. ## Distinguir actualización local y confirmación de guardado | Operación | Significado | | --- | --- | | Escritura de página completada | La operación local terminó; la confirmación del servidor puede seguir pendiente. | | `await view.flush()` | Enviar borradores y esperar escrituras anteriores y confirmación colaborativa; continuar editando. | | `await view.prepareToLeave()` | Pausar y guardar. Salir tras el éxito o llamar a `view.resume()` si se cancela la navegación. | | `view.dispose()` | Liberar conexiones, Engines y suscripciones; no guarda automáticamente. | Las suscripciones actualizan los valores tras aplicar resultados de fórmulas. Si falla el guardado, conserva la página y reintenta guardar. Una escritura local completada no equivale a datos guardados. ## Continuar la integración - [Repositorio y descripción del SDK](https://github.com/dream-num/univer-data-binding-sdk) - [API de Binding Engine](https://github.com/dream-num/univer-data-binding-sdk/blob/main/packages/binding-engine/README.md) - [Atributos de enlace HTML](https://github.com/dream-num/univer-data-binding-sdk/blob/main/packages/html-view/README.md) - [Integración de Renderer](https://github.com/dream-num/univer-data-binding-sdk/blob/main/packages/html-view-renderer/README.md) - [API JavaScript de página](https://github.com/dream-num/univer-data-binding-sdk/blob/main/packages/html-view-renderer/docs/javascript-api.md) Funciones relacionadas: [ejecución sin interfaz y cálculo en servidor](https://docs.univer.ai/es-ES/overview/features/shared/server-calculation.md) · [colaboración en tiempo real](https://docs.univer.ai/es-ES/overview/features/shared/collaboration.md) · [Agents y automatización](https://docs.univer.ai/es-ES/overview/features/shared/agents.md). [Volver a todas las funciones](https://docs.univer.ai/es-ES/overview/features.md)