handsontable教程_三分钟,vueExcel表格插件handsontable.js教程

三分钟,vueExcel表格插件handsontable.js教程

效果图:

npm 安装handsontable

npm install handsontable @handsontable/vue

创建handsontable

引入hansontable

import {HotTable} from '@handsontable/vue';

import Handsontable from 'handsontable';

添加配置

hotSettings: {

// language:'zh-CN',

licenseKey: 'non-commercial-and-evaluation',//隐藏版权文字

// data: Handsontable.helper.createSpreadsheetData(10, 26),//列表初始化数据

data: [

['', '河北', '山东', '广东'],

["2016", 10, 11, 12,],

["2017", 20, 11, 14,],

["2018", 30, 15, 12,]

],

startRows: 3,//初始化行数,无data属性时生效(该值小于minRows时,以minRows为准)

startCols: 10,//初始化列数,无data属性时生效(该值小于minCols时,以minCols为准)

minRows: 5,//最少行数(当初始化数据小于该值时,