前端组件wolfTable的style格式文档

  • 前端组件wolfTable的style格式文档已关闭评论
  • 84 次浏览
  • A+
所属分类:Web前端
摘要

此文档记录的是wolf-table的style格式文档, 如果你找的是x-data-spreadsheet, 那么请查阅这个文档https://www.cnblogs.com/WilsonZhu/p/17858411.htmlwolf-table 的格式输入只有一个方式, 通过调用addStyle以及cell函数来进行格式的改变

此文档记录的是wolf-table的style格式文档, 如果你找的是x-data-spreadsheet, 那么请查阅这个文档https://www.cnblogs.com/WilsonZhu/p/17858411.htmlwolf-table 的格式输入只有一个方式, 通过调用addStyle以及cell函数来进行格式的改变

例子如下:
import Table from '@wolf-table/table';let a = Table.create('#id',()=>400,()=>400); //初始化表格,并且设置绑定的元素,宽度和高度 第一个值填入的内容要能够被 document.querySelector()解析
let styleIndex = a.addStyle({bold:true,strikethrough:true}); //这里是调用增加格式的函数, 会返回增加的这个格式的调用索引
a.cell(1,1,{value:'abc',style:styleIndex}); // 这里的cell函数一共有3个输入, 第一个是行的索引,第二个是列的索引,第三个是单元格所对应的对象, 对象中的value元素代表单元格的值, style元素放的是格式的调用索引
a.render(); //这个render函数非常关键, 如果不调用这个函数,那么你上面做的所有的事都不会生效

以下是style对象中生效的配置fontSize, //字号
fontFamily, //字体
bold, //加粗 放Boolean
italic, //斜体 放Boolean
color, //字体颜色 16进制颜色
bgcolor, //单元格颜色 16进制颜色
align, //水平对齐 参考canvas中的align变量
valign, //垂直对齐 参考canvas中的valign变量
underline, //下划线 放Boolean
strikethrough, //划线 放Boolean
rotate, //旋转 放数字
textwrap, //我不知道这个是拿来干啥的
padding //和html中的padding一个意思 放的是数字