纯前端下载导出生成CSV文件

@params {Array} data 数据

@param {object} options 配置项

@return {Blob} CSV Blob对象

export const generateCSV = (data, options = {}) => {

  const columns = options.columns || []

  // 字段

  const validColumns = []

  columns.forEach(col => {

    if (typeof col === 'string') {

      validColumns.push({

        property: col

      })

    } else if (typeof col === 'object') {

      validColumns.push(col)

    }

  })

  // 数据

  const content = data.map(record => {

    return columns

      .map(col => {

        let value = ''

        if (typeof col.formatter === 'function') {

          value = col.formatter.call(undefined, record, col, record[col.property])

        } else {

          value = record[col.property]

        }

        value = value === undefined ? '' : String(value)

        return `"${value.replace(/[\n\t\r]/g, '')}"`

      })

      .join(',')

  })

  // 表头

  const header = validColumns.map(col => `"${col.title || col.property}"`).join(',')

  // 文件头加入BOM信息U+FEFF,避免中文乱码

  return new Blob(['\uFEFF' + [header, ...content].join('\r\n')], { type: 'text/csv' })

}

// 使用方法

handleDownload () {
      let data = []
      let columns = [
        {
          property: 'caller',
          title: '调用方'
        },
        {
          property: 'callee',
          title: '被调用方'
        }
      ]
      this.graph.cfg.data.children.forEach(item => {
        if (item.position === 'left') {
          data.push({
            caller: item.label,
            callee: ''
          })
        } else {
          data.push({
            caller: '',
            callee: item.label
          })
        }
      })
      saveFile(generateCSV(data, { columns }), `data_${Date.now()}.csv`)
    }
posted @ 2020-11-09 16:06  奇德隆咚强  阅读(399)  评论(0)    收藏  举报