Package Exports
- vue-handsontable-element
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (vue-handsontable-element) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
申明
.[基于 handsontable 二次封装源码]: https://github.com/hf0913/vue-handsontable-element .[handsontable 官网]: https://handsontable.com/
简要步骤
- 原表格标签修改为：Handsontable
- 对于 columns，key 或者 data 属性名都可以用来存放后端字段名
- 对于 columns 中 type 属性，仅支持：autocomplete、checkbox、date、dropdown、handsontable、numeric、password、text、time，默认为 text，切记不要设置 type 类型为其他值
示例代码
使用说明
- 关于下拉框，建议使用【title: "下拉框(优化模式，options 属性或者 source 属性，接受一个回调函数，返回数据字典集合)"】这种类型
- 获取某一个单元格值：this.core.getDataAtCell(row,col)
- 获取某一行数据：this.core.getDataAtRow(row)
- 获取某一列数据：this.core.getDataAtCol(col)
- 折叠行，https://handsontable.com/docs/7.4.2/demo-nested-rows.html
- 设置某一个单元格的值：this.core.setDataAtCell(row, col, value, '标记')
- 关于 core 获取，可以通过@getCore 方法，查看上面的示例代码，change 方法和 click 方法也会返回 core 对象
- 请勿使用 setTimeout 来达到视图层更新
- 修改数组某一项，如果视图没有响应式渲染，请调用 this.core.render()
建议
- 修改数组，建议使用可以修改原数组的方法，比如：push、splice、unshift、pop 等等
- 修改对象某属性，先 data 中申明，然后可以使用 Object.assign 进行浅合并，示例：this.testOpts = Object.assign({}, testOpts, this.testNewOpts);
- 修改单元格值请调用 core 方法中的 setDataAtCell