Vue实现在线编辑excel

已于 2023-03-31 15:46:43 修改
阅读量1.3w 收藏 15
点赞数 3
分类专栏： VUE 文章标签： vue
于 2022-03-23 10:34:20 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/eeeeeeeeeqsdfsd/article/details/123679664
版权

Vue实现在线编辑excel

Luckysheet官网git# 

特点

格式设置：样式，条件格式，文本对齐及旋转，文本截断、溢出、自动换行，多种数据类型，单元格内多样式
单元格：拖拽，下拉填充，多选区，查找和替换，定位，合并单元格，数据验证
行和列操作：隐藏、插入、删除行或列，冻结，文本分列
操作体验：撤销、重做，复制、粘贴、剪切，快捷键，格式刷，选区拖拽
公式和函数：内置公式，远程公式，自定义公式
表格操作：筛选，排序
增强功能：数据透视表，图表，评论，共享编辑，插入图片，矩阵计算，截图，复制到其他格式，EXCEL导入及导出等
使用
引入

<!--CDN-->
<link rel='stylesheet' href='https://cdn.jsdelivr.net/npm/luckysheet/dist/plugins/css/pluginsCss.css' />
<link rel='stylesheet' href='https://cdn.jsdelivr.net/npm/luckysheet/dist/plugins/plugins.css' />
<link rel='stylesheet' href='https://cdn.jsdelivr.net/npm/luckysheet/dist/css/luckysheet.css' />
<link rel='stylesheet' href='https://cdn.jsdelivr.net/npm/luckysheet/dist/assets/iconfont/iconfont.css' />
<script src="https://cdn.jsdelivr.net/npm/luckysheet/dist/plugins/js/plugin.js"></script>
<script src="https://cdn.jsdelivr.net/npm/luckysheet/dist/luckysheet.umd.js"></script>

<!--或本地引入-->
<link rel='stylesheet' href='./plugins/css/pluginsCss.css' />
<link rel='stylesheet' href='./plugins/plugins.css' />
<link rel='stylesheet' href='./css/luckysheet.css' />
<link rel='stylesheet' href='./assets/iconfont/iconfont.css' />
<script src="./plugins/js/plugin.js"></script>
<script src="./luckysheet.umd.js"></script>
指定表格容器

<div id="luckysheet" style="margin:0px;padding:0px;position:absolute;width:100%;height:100%;left: 0px;top: 0px;"></div>

创建表格

<script>
    $(function () {
        //配置项
        var options = {
            container: 'luckysheet' //luckysheet为容器id
        }
        luckysheet.create(options)
    })
</script>

开发
下载源码到本地

git clone https://github.com/mengshukeji/Luckysheet.git
cd Luckysheet
安装依赖

npm i
安装gulp

npm install gulp -g
启动

npm run dev
打包

npm run build

在这里插入图片描述

3.excelJs分解Dom为excel文件流
/* eslint-disable */
 
// 文档 https://github.com/exceljs/exceljs/blob/HEAD/README_zh.md
const Excel = require('exceljs');
 
function setMerge(luckyMerge = {}, worksheet) {
  const mergearr = Object.values(luckyMerge);
  mergearr.forEach((elem) => {
    // elem格式：{r: 0, c: 0, rs: 1, cs: 2}
    // 按开始行，开始列，结束行，结束列合并（相当于 K10:M12）,
    // 合并单元格
    worksheet.mergeCells(
      elem.r + 1,
      elem.c + 1,
      elem.r + elem.rs,
      elem.c + elem.cs,
    );
  });
}
 
/**
 * @description 配置项设置
 * @param {*} configs
 * @param {*} worksheet
 * @returns
 */
function setConfig(configs, worksheet) {
  /**
   *  @description luckysheet表格配置项
   *  "rowlen":{}, 表格行高
   *  "columnlen":{}, 表格列宽
   *  "rowhidden":{}, 隐藏行
   *  "colhidden":{}, 隐藏列
   *  "authority":{}, 工作表保护
   */
  // console.log(configs, Object.keys(configs.rowlen), Object.keys(configs.columnlen));
  // 设置隐藏行
  if (configs.rowhidden) {
    Object.keys(configs.rowhidden).forEach((val) => {
      const row = worksheet.getRow(Number(val)+1);
      row.hidden = true;
    });
  }
  // 设置隐藏列
  if (configs.colhidden) {
    Object.keys(configs.colhidden).forEach((val) => {
      const col = worksheet.getColumn(Number(val)+1);
      col.hidden = true;
    });
  }
  // 设置显示行
  if (configs.rowlen) {
    Object.keys(configs.rowlen).forEach((val) => {
      // 获取一个行对象。如果尚不存在，则将返回一个新的空对象
      const row = worksheet.getRow((Number(val) + 1));
      // console.log(configs.rowlen[val]);
      // 设置特定的行高
      row.height = configs.rowlen[val] - 10;
    });
  }
 
  // 设置显示列
  if (configs.columnlen) {
    Object.keys(configs.columnlen).forEach((val) => {
      // 通过键，字母和基于1的列号访问单个列
      const col = worksheet.getColumn((Number(val) + 1));
      // 设置特定的行高
      col.width = (configs.columnlen[val] + 2) / 8;
    });
  }
}
 
/**
 * @description 表格样式
 * @param {*} borderType
 * @param {*} style
 * @param {*} color
 * @returns
 */
function borderConvert(borderType, style = 1, color = '#000') {
  // 对应luckysheet的config中borderinfo的的参数
  if (!borderType) {
    return {};
  }
  const luckyToExcel = {
    type: {
      'border-all': 'all',
      'border-top': 'top',
      'border-right': 'right',
      'border-bottom': 'bottom',
      'border-left': 'left',
    },
    style: {
      0: 'none',
      1: 'thin',
      2: 'hair',
      3: 'dotted',
      4: 'dashDot', // 'Dashed',
      5: 'dashDot',
      6: 'dashDotDot',
      7: 'double',
      8: 'medium',
      9: 'mediumDashed',
      10: 'mediumDashDot',
      11: 'mediumDashDotDot',
      12: 'slantDashDot',
      13: 'thick',
    },
  };
  const template = {
    style: luckyToExcel.style[style],
    color: { argb: color.replace('#', '') },
  };
  const border = {};
  if (luckyToExcel.type[borderType] === 'all') {
    border.top = template;
    border.right = template;
    border.bottom = template;
    border.left = template;
  } else {
    border[luckyToExcel.type[borderType]] = template;
  }
  return border;
}
 
/**
 *
 * @param {*} borders
 * @param {*} row_index
 * @param {*} col_index
 * @returns
 */
function addborderToCell(borders) {
  const border = {};
  const luckyExcel = {
    type: {
      l: 'left',
      r: 'right',
      b: 'bottom',
      t: 'top',
    },
    style: {
      0: 'none',
      1: 'thin',
      2: 'hair',
      3: 'dotted',
      4: 'dashDot', // 'Dashed',
      5: 'dashDot',
      6: 'dashDotDot',
      7: 'double',
      8: 'medium',
      9: 'mediumDashed',
      10: 'mediumDashDot',
      11: 'mediumDashDotDot',
      12: 'slantDashDot',
      13: 'thick',
    },
  };
  Object.keys(borders).forEach((bor) => {
    if (borders[bor].color.indexOf('rgb') === -1) {
      border[luckyExcel.type[bor]] = {
        style: luckyExcel.style[borders[bor].style],
        color: { argb: borders[bor].color.replace('#', '') },
      };
    } else {
      border[luckyExcel.type[bor]] = {
        style: luckyExcel.style[borders[bor].style],
        color: { argb: borders[bor].color },
      };
    }
  });
 
  return border;
}
 
function addCellImages(images, workbook, worksheet) {
  // 通过 base64  将图像添加到工作簿
  Object.keys(images).forEach((el) => {
    const myBase64Image = images[el];
    const imageId2 = workbook.addImage({
      base64: myBase64Image.src,
      extension: 'png',
    });
    worksheet.addImage(imageId2, {
      tl: { col: myBase64Image.fromCol, row: myBase64Image.fromRow },
      br: { col: myBase64Image.toCol, row: myBase64Image.toRow },
      editAs: 'oneCell', // undefined, oneCell, absolute
      // ext: { width: 500, height: 200 },
    });
  });
}
 
/**
 * @description 设置边框
 * @param {*} luckyBorderInfo
 * @param {*} worksheet
 * @returns
 */
function setBorder(luckyBorderInfo, worksheet) {
  if (!Array.isArray(luckyBorderInfo)) return;
  luckyBorderInfo.forEach((elem) => {
    // 现在只兼容到borderType 为range的情况
    if (elem.rangeType === 'range') {
      const border = borderConvert(elem.borderType, elem.style, elem.color);
      const rang = elem.range[0];
      const { row, column } = rang;
      for (let i = row[0] + 1; i < row[1] + 2; i++) {
        for (let y = column[0] + 1; y < column[1] + 2; y++) {
          worksheet.getCell(i, y).border = border;
        }
      }
    }
    if (elem.rangeType === 'cell') {
      const { col_index: colIndex, row_index: rowIndex } = elem.value;
      const borderData = Object.assign({}, elem.value);
      delete borderData.col_index;
      delete borderData.row_index;
      const border = addborderToCell(borderData, rowIndex, colIndex);
      // console.log('bordre', border, borderData)
      worksheet.getCell(rowIndex + 1, colIndex + 1).border = border;
    }
    // console.log(rang.column_focus + 1, rang.row_focus + 1)
    // worksheet.getCell(rang.row_focus + 1, rang.column_focus + 1).border = border
  });
}
 
/**
 * @description 背景色填充
 * @param {*} bg
 * @returns
 */
function fillConvert(bg) {
  if (!bg) {
    return {};
  }
  // const bgc = bg.replace('#', '')
  const fill = {
    type: 'pattern',
    pattern: 'solid',
    fgColor: { argb: bg.replace('#', '') },
  };
  return fill;
}
 
/**
 * @description 字体设置
 * @param {*} ff
 * @param {*} fc
 * @param {*} bl
 * @param {*} it
 * @param {*} fs
 * @param {*} cl
 * @param {*} ul
 * @returns
 */
function fontConvert(
  ff = 0,
  fc = '#000000',
  bl = 0,
  it = 0,
  fs = 10,
  cl = 0,
  ul = 0
) {
  // luckysheet：ff(样式), fc(颜色), bl(粗体), it(斜体), fs(大小), cl(删除线), ul(下划线)
  const luckyToExcel = {
    0: '微软雅黑',
    1: '宋体（Song）',
    2: '黑体（ST Heiti）',
    3: '楷体（ST Kaiti）',
    4: '仿宋（ST FangSong）',
    5: '新宋体（ST Song）',
    6: '华文新魏',
    7: '华文行楷',
    8: '华文隶书',
    9: 'Arial',
    10: 'Times New Roman ',
    11: 'Tahoma ',
    12: 'Verdana',
    num2bl: (num) => num !== 0,
  };
  // 出现Bug，导入的时候ff为luckyToExcel的val
 
  const font = {
    name: typeof ff === 'number' ? luckyToExcel[ff] : ff,
    family: 1,
    size: fs,
    color: { argb: fc.replace('#', '') },
    bold: luckyToExcel.num2bl(bl),
    italic: luckyToExcel.num2bl(it),
    underline: luckyToExcel.num2bl(ul),
    strike: luckyToExcel.num2bl(cl),
  };
 
  return font;
}
 
/**
 * @description 单元格排列方式
 * @param {*} vt
 * @param {*} ht
 * @param {*} tb
 * @param {*} tr
 * @returns
 */
function alignmentConvert(
  vt = 'default',
  ht = 'default',
  tb = 'default',
  tr = 'default'
) {
  // luckysheet:vt(垂直), ht(水平), tb(换行), tr(旋转)
  const luckyToExcel = {
    vertical: {
      0: 'middle',
      1: 'top',
      2: 'bottom',
      default: 'top',
    },
    horizontal: {
      0: 'center',
      1: 'left',
      2: 'right',
      default: 'left',
    },
    wrapText: {
      0: false,
      1: false,
      2: true,
      default: false,
    },
    textRotation: {
      0: 0,
      1: 45,
      2: -45,
      3: 'vertical',
      4: 90,
      5: -90,
      default: 0,
    },
  };
 
  const alignment = {
    vertical: luckyToExcel.vertical[vt],
    horizontal: luckyToExcel.horizontal[ht],
    wrapText: luckyToExcel.wrapText[tb],
    textRotation: luckyToExcel.textRotation[tr],
  };
  return alignment;
}
 
/**
 * @description 单元格创建
 * @param {*} n
 * @returns
 */
function createCellPos(n) {
  const ordA = 'A'.charCodeAt(0);
 
  const ordZ = 'Z'.charCodeAt(0);
  const len = ordZ - ordA + 1;
  let s = '';
  while (n >= 0) {
    s = String.fromCharCode((n % len) + ordA) + s;
 
    n = Math.floor(n / len) - 1;
  }
  return s;
}
 
/**
 * @description 设置单元格格式，样式和值
 * @param {*} cellArr
 * @param {*} worksheet
 * @returns
 */
function setStyleAndValue(cellArr, worksheet) {
  if (!Array.isArray(cellArr)) return;
  cellArr.forEach((row, rowid) => {
    row.every((cell, columnid) => {
      if (!cell) return true;
      const fill = fillConvert(cell.bg, cell.mc);
 
      const font = fontConvert(
        cell.ff,
        cell.fc,
        cell.bl,
        cell.it,
        cell.fs,
        cell.cl,
        cell.ul,
      );
      const alignment = alignmentConvert(cell.vt, cell.ht, cell.tb, cell.tr);
      let value = '';
 
      if (cell.f) {
        value = { formula: cell.f, result: cell.v };
      } else if (!cell.v && cell.ct && cell.ct.s) {
        // xls转为xlsx之后，内部存在不同的格式，都会进到富文本里，即值不存在与cell.v，而是存在于cell.ct.s之后
        // value = cell.ct.s[0].v
        cell.ct.s.forEach(arr => {
          value += arr.v;
        });
      } else {
        value = cell.v;
      }
      //  style 填入到_value中可以实现填充色
      const letter = createCellPos(columnid);
      const target = worksheet.getCell(letter + (rowid + 1));
      Object.keys(fill).forEach(() => {
        target.fill = fill;
      });
      target.font = font;
      target.alignment = alignment;
      target.value = value;
      return true;
    });
  });
}
 
export default function exportExcel(luckysheet, value) {
  // 参数为luckysheet.getluckysheetfile()获取的对象
  // 1.创建工作簿，可以为工作簿添加属性
  const workbook = new Excel.Workbook();
  // 2.创建表格，第二个参数可以配置创建什么样的工作表
  if (Object.prototype.toString.call(luckysheet) === '[object Object]') {
    luckysheet = [luckysheet];
  }
  luckysheet.forEach((table) => {
    if (table.data.length === 0) return true;
    // ws.getCell('B2').fill = fills.
    // console.log(table, '+++++++++++');
    const worksheet = workbook.addWorksheet(table.name);
    const merge = (table.config && table.config.merge) || {};
    const borderInfo = (table.config && table.config.borderInfo) || {};
    const configs = table.config  || {};
    // 3.设置单元格合并,设置单元格边框,设置单元格样式,设置值
    // 创建单元格并计算单元格内部内容样式及格式
    setStyleAndValue(table.data, worksheet);
    // 是否包含除merge和borderInfo外的luckysheet多余配置项
    if (Object.keys(configs).length > 2) setConfig(configs, worksheet);
    // 合并单元格
    setMerge(merge, worksheet);
    // 计算单元格自身样式
    setBorder(borderInfo, worksheet);
    // 是否包含图片
    if (table.images) addCellImages(table.images, workbook, worksheet);
    return true;
  });
 
  // 4.写入 buffer
  const buffer = new Promise((resolve) => {
    workbook.xlsx.writeBuffer().then(data => {
      const blob = new Blob([data], {
        type: 'application/vnd.ms-excel;charset=utf-8',
      });
      const File = new window.File([blob], `${value}.xlsx`, { type: 'application/vnd.ms-excel;charset=utf-8' });
      File.uid = File.size + new Date().getTime(); // 文件大小+时间戳
      resolve(File);
      // console.log('导出成功！');
      // FileSaver.saveAs(blob, `${value}.xlsx`);
    });
  });
  return buffer;
}
admin-Y
关注
专栏目录
vue3在线Excel系统
08-16
Vue3在线Excel系统是一个基于Vue.js 3.x框架开发的在线电子表格应用程序。它提供了一个用户友好的界面，使用户可以轻松地创建、编辑和管理电子表格数据。 该系统具有以下特点和功能： 响应式布局：Vue3在线Excel系统采用响应式设计，能够自动适应不同设备和屏幕大小，确保用户在各种平台上都能获得良好的使用体验。 功能强大：该系统提供了丰富的电子表格功能，包括单元格操作（插入、删除、复制、粘贴）、行列操作（插入、删除、隐藏、调整大小）、格式设置（字体、边框、颜色等）、公式计算、排序、筛选等。 数据交互：用户可以方便地导入和导出不同格式的文件，如Excel、CSV等。同时，系统还支持与后端服务器进行数据交互，实现数据的存储和共享。 实时协作：多用户可以同时编辑同一份电子表格，实时更新和同步数据变化，支持多人协作办公。 定制化：Vue3在线Excel系统提供了丰富的定制化选项，用户可以根据自己的需求设置表格样式、布局和功能，以满足个性化的要求。 总而言之，在线Excel系统为用户提供了一个功能强大、易用且高度定制化的在线电子表格平台，能够满足个人和团队在数据处理和协作
vue实现在线Excel表格功能
qq_37312180的博客
01-25 2861
vue实现在线Excel表格功能。
vue纯前端使用exceljs导出excel文件手把手教程，非官方文档直粘
最新发布
Yy55gc25112的博客
08-06 3737
纯前端使用exceljs导出excel文件超详细教程，一文学会!
Vue实现在线编辑excel、导入、导出
zby18638890018的博客
06-16 1万+
Vue实现在线编辑excel、导入、导出
vue中excel的编辑、导入、导出
风舞红枫的个人博客
08-13 4578
vue中实现excel的编辑、导入、导出
vue可编辑表格
10-25
基于vue的可编辑表格 很多时候我们需要直接编辑表格内容，这个组件刚好解决了需求
VUE3项目中通过LuckySheet实现Excel在线编辑
m0_59415345的博客
03-23 5305
在实现Excel文件导入时，领导要求实现在前端导入文件后，不调用后端的接口，而是直接显示excel文件的内容，等待用户修改完以后，再调用后端接口进行文件的提交。在这种应用场景下，使用了LuckySheet进行改功能的实现。附上。
vue实现在线编辑excel（转）
qq_43787947的博客
03-01 1459
不支持ie 支持edge 需要ie请换方法 vue不再赘述 安装x-data-spreadsheet npm install x-data-spreadsheet <template> <div id="x-spreadsheet-demo"></div> </template> <script> import Spreadsheet from 'x-data-spreadsheet'; import zhCN
vue集成Luckyexcel实现在线编辑Excel，可自行导入，也可从服务器端获取
热门推荐
weixin_45000975的博客
12-10 1万+
安装 依赖 npm install luckyexcel 在页面中引入 import LuckyExcel from 'luckyexcel' html中 <div id="luckysheet" style="margin:0px;padding:0px;width:100%;height:100%;"></div> 在mounted中注册 var options = { container: 'luckysheet', //luckysheet为容器
vue3+luckyexcel在线编辑excel文件本地引用文件
12-27
可以导入文档，预览、编辑、保存、导出等功能，可以满足大部分需求
Vue.js实现可编辑的表格
10-15
主要为大家详细介绍了Vue.js实现可编辑的表格，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
Vue或uniapp使用luckysheet免费开发多人在线编辑Excel文档
04-16
使用该压缩包可以使Vue或uniapp使用luckysheet免费开发多人在线编辑Excel档 使用说明可打开链接https://blog.csdn.net/weixin_43416253/article/details/124211439?spm=1001.2014.3001.5502 或在论坛中搜索“Vue或uniapp使用luckysheet免费开发多人在线编辑Excel文档”里面有详细说明，如有疑问也可在文章下方留言
适用于Vue的可编辑的表格组件支持多种快捷键操作模拟Excel的操作体验
08-09
适用于Vue的可编辑的表格组件，支持多种快捷键操作，模拟Excel的操作体验
html excle 在线编辑
01-03
通过html js css 实现对ecxel 仿真在线编辑操作，合并行 、居中、边框、下载、导出JSON等操作
VUE3中使用Univer Docs（原Luckysheet ）创建在线编辑Excel
m0_59415345的博客
03-15 7090
Univer 是一套企业文档与数据协同解决方案，包括电子表格、文档和幻灯片三大文档类型，高可扩展性设计使得开发者可以在 Univer 的基础上定制个性化功能。它的前身是Luckysheet ，Luckysheet 是一款纯前端类似excel的在线表格，功能强大、配置简单、完全开源。一款纯前端类似excel的在线表格，功能强大、配置简单、完全开源。
vue3集成LuckySheet实现导入本地Excel进行在线编辑，以及导出功能
青莳的博客
07-29 1145
点击按钮选择一个xlsx文件就能导入成功了，效果如下（这里只能导入xlsx文件，导入xls文件会报错，暂时不知道什么原因，如果有xls文件的话可以把表格另存为xlsx类型的文件再导入）首先要引入luckyexcel 的依赖，我们导入导出本地excel会用到。第一步：克隆或者下载下面的代码。接下来就是在项目中使用这个插件。然后创建一个vue页面文件。
vue 在线编辑excel表格（原生和使用组件的两种方式）
qq_49732089的博客
02-26 5362
vue 在线编辑表格（原生和使用组件的两种方式） top表头和left表头格式的表格 <template> <div> <!-- 用组件写的编辑表格 --> <el-table border :data="tableData" style="width: 100%"> <el-table-column v-f
vue在线编辑excel
06-26
### 回答1： Vue在线编辑Excel是一种通过Vue框架开发的一款在线Excel编辑工具。它允许用户打开Excel中的单元格，并使用Vue组件在表格中编辑它们。该工具使用JavaScript和Vue.js作为底层技术，实现了一系列Excel编辑特性，如单元格合并、格式化、排序、筛选和查找等。 Vue在线编辑Excel具有多页面和多标签编辑器等方便的用户界面，并提供了快速导入和导出Excel文件的选项。用户可以通过该工具创建新的Excel表格，并在线进行实时编辑，允许用户进行多人协同编辑，同时支持多用户同时访问一个表格并进行编辑，从而增强了工作效率。 Vue在线编辑Excel包含了许多功能，如图表、数据透视表、自动过滤，以及数据分组等，方便了用户对Excel表格数据的分析和操作。它具有很好的兼容性和可扩展性，可以集成许多其他工具如DHTMLX，以满足不同用户的需求。 总之，Vue在线编辑Excel是一种功能强大的在线Excel编辑工具，它为用户提供了一种简单、高效、可扩展的方式来编辑Excel表格，并为用户在工作流程中带来了巨大的便利和效益。 ### 回答2： Vue是一种开源的JavaScript框架，可以用于构建单页面应用程序，特别是与大型项目相关的复杂应用程序。因此，可以将Vue用于在线编辑Excel，以便用户可以快速轻松地浏览和编辑大量数据。 Vue支持数据双向绑定，并且可以使用组件使代码模块化和易于维护。这意味着开发人员可以使用Vue编写用于创建、保存和编辑Excel文档的组件，这些组件包括表头和表体，单元格、工具栏以及编辑器区域。 在线编辑Excel还需要一个数据结构用于存储和检索Excel数据。开发人员可以使用JavaScript的数组和对象等数据结构、以及使用类似于Redux的全局状态管理工具来处理Excel数据。这些工具使应用程序更加灵活和易于扩展，同时还增强了数据的可靠性和一致性。 为了提供更好的用户体验，可以使用现代化的前端框架和技术，如Webpack、Babel、ESLint等，优化和微调Vue应用程序。这可以提高应用程序的性能、可靠性和灵活性，并使其更易于部署和维护。 总之，在线编辑Excel需要充分利用Vue的双向数据绑定和组件，以及JavaScript数据结构和全局状态管理工具，提供高效、可靠、易于扩展的应用程序。
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值