# Excel

# Exportar Excel

La importación y exportación de Excel se implementa confiando en js-xlsx.

Export2Excel.js está empaquetado en el js-xlsx para facilitar la exportación de datos.

# Utilizar

Ya que Export2Excel depende no solo de js-xlsx sino también de file-saver y script-loader.

Así que primero necesitas instalar el siguiente comando:

npm install xlsx file-saver -S
npm install script-loader -S -D

Dado que el tamaño js-xlsx todavía es muy grande, la función de exportación no es una función muy común, por lo que se recomienda una carga lenta al usarla. El método de uso es el siguiente:

import('@/vendor/Export2Excel').then(excel => {
  excel.export_json_to_excel({
    header: tHeader, //Se requiere encabezado
    data, //Datos específicos requeridos
    filename: 'excel-list', //Opcional
    autoWidth: true, //Opcional
    bookType: 'xlsx' //Opcional
  })
})

# Parámetros

# Ejemplo

import('@/vendor/Export2Excel').then(excel => {
  const tHeader = ['Id', 'Title', 'Author', 'Readings', 'Date']
  const data = this.list
  excel.export_json_to_excel({
    header: tHeader, //Se requiere encabezado
    data, //Datos específicos requeridos
    filename: 'excel-list', //Opcional
    autoWidth: true, //Opcional
    bookType: 'xlsx' //Opcional
  })
})

• Demo, en línea
• Código, en línea

# Importación de Excel

Encapsulado UploadExcel Componente de importación de Excel, haga clic en el soporte y arrastre la carga, también es dependiente en js-xlsx.

Proporciona dos funciones de devolución de llamada:

• beforeUpload

  Puedes hacer algunos juicios especiales antes de subir. Por ejemplo, si el tamaño del archivo es mayor que 1 megabyte? Si es superior a 1 megabyte, deja de analizar y muestra un mensaje de error.

  beforeUpload(file) {
    const isLt1M = file.size / 1024 / 1024 < 1

    if (isLt1M) {
      return true
    }

    this.$message({
      message: 'Por favor, no cargue archivos de más de 1m de tamaño.',
      type: 'warning'
    })
    return false
  }

• onSuccess Una función de devolución de llamada que se activa cuando el análisis se realiza correctamente, que devuelve el encabezado y el contenido de la tabla.

  handleSuccess({ results, header }) {
    this.tableData = results
    this.tableHeader = header
  }

• Demo en línea
• Código fuente