Descripción general de la hoja de cálculo React

    El componente React Spreadsheet (visor de Excel) es liviano, tiene muchas funciones y cuenta con todas las opciones necesarias para operar, visualizar y editar todo tipo de datos de hojas de cálculo: científicos, comerciales, financieros y más. Toda la información se puede presentar en un formato tabular que resulta intuitivo y fácil de navegar a través de celdas, paneles y hojas de trabajo. IgrSpreadsheet se complementa con una interfaz flexible similar a la de Excel, gráficos detallados y funciones como activación, edición de celdas, formato condicional, estilo, selección y portapapeles.

    React Spreadsheet Example

    Functionality

    • Características

    Al igual que en la hoja de cálculo de Excel, puede aplicar funciones de filtrado, clasificación, mover celdas, personalización en términos de color de celdas, atajos de teclado y agregar la capacidad de incluso calcular fórmulas.

    Spreadsheet Usage

    • Actuación

    La hoja de cálculo es compatible con todos los navegadores modernos y está optimizada para modelos de hojas de cálculo complejos y voluminosos, al tiempo que garantiza una funcionalidad y simplicidad impecables.

    • Diseño flexible y fácil personalización

    Puede seleccionar, agregar, eliminar, activar o desactivar fácilmente las funciones que desee y configurar hojas React en un instante para que todo responda a las necesidades de los usuarios finales. También hay bibliotecas configurables, alternativas de estilo y formato, opciones de visibilidad y muchos temas para elegir.

    • Cómoda interfaz tipo Excel

    Al igual que operar datos en Excel, nuestro componente de hoja de cálculo ofrece todas las operaciones conocidas del portapapeles de Excel: copiar, pegar, cortar. No necesitarás formación adicional ni nuevas habilidades para empezar a utilizarlo de inmediato. También viene con opciones para ordenar, navegación completa con el teclado, valores y fórmulas, arrastrar celdas, editar columnas y filas, filtrar, formatear números y cambiar el tamaño. El motor de cálculo rápido e inteligente impulsa incluso las estimaciones más complejas. Sin dependencias de Excel.

    • Operaciones de datos

    Recopile y administre datos científicos, comerciales, de ingeniería, financieros y educativos. Prepare y cree análisis, cuadrículas avanzadas, informes, formularios de entrada de datos, elaboración de presupuestos, escenarios de previsión y hojas de cálculo personalizadas. Todo esto gracias a la API integral.

    • Procesamiento de datos rápido y seguro

    Con nuestra hoja de cálculo, el procesamiento de datos es 100% seguro y protegido...

    • Importación y exportación de Excel y CSV

    Con la funcionalidad incorporada de importación/exportación de Excel, puede cargar y abrir instantáneamente documentos de Excel y verlos a pedido, agregar cambios y guardarlos. Además, exporte sin esfuerzo sus hojas de cálculo Excel .xlsx completas.

    Dependencies

    Al instalar el componente de hoja de cálculo React, también se deben instalar el paquete principal y de Excel.

    npm install --save igniteui-react-core
    npm install --save igniteui-react-excel
    npm install --save igniteui-react-spreadsheet
    

    Component Modules

    La IgrSpreadsheet requiere los siguientes módulos:

    import { IgrExcelModule } from 'igniteui-react-excel';
    import { IgrSpreadsheetModule } from 'igniteui-react-spreadsheet';
    
    IgrExcelModule.register();
    IgrSpreadsheetModule.register();
    

    Usage

    Ahora que se importa el módulo de hoja de cálculo React, lo siguiente es la configuración básica de la hoja de cálculo.

    [!Note]

    In the following code snippet, an external ExcelUtility class is used to save and load a workbook.

    A continuación se muestra cómo cargar un libro de trabajo en la hoja de cálculo React.

    import { IgrSpreadsheet } from 'igniteui-react-spreadsheet';
    import { ExcelUtility } from 'ExcelUtility';
    
    // ...
    
    public spreadsheet : IgrSpreadsheet = new IgrSpreadsheet({})
    
    ngOnInit() {
        const excelFile = '../../assets/Sample1.xlsx';
        ExcelUtility.loadFromUrl(excelFile).then((w) => {
          this.spreadsheet.workbook = w;
        });
    }
    

    API References