@freegridjs/ svelte (英语)

Svelte 5 组件和行动 免费Grid。 。 。 .

npm i @freegridjs/core @freegridjs/svelte

<script>
  import { FreeGrid } from '@freegridjs/svelte';
  import '@freegridjs/core/styles.css';

  let api;
  const columns = [{ field: 'name' }, { field: 'qty', type: 'number' }];
  let rows = $state([{ name: 'Pen', qty: 3 }]);
</script>

<FreeGrid {columns} data={rows} rowSelection="multiple" height={480}
          onReady={a => (api = a)} onCellClick={e => console.log(e.row)} />

每个网格选项都是道具;事件是 on + 事件名称 (onSortChange, (中文(简体) ), onCellValueChanged(中文(简体) ). columns, (中文(简体) ), data, (中文(简体) ), theme, (中文(简体) ), locale, (中文(简体) ), summary, (中文(简体) ), groupBy, (中文(简体) ), pivot, (中文(简体) ), fontSize 财务报告和审定财务报表 fontFamily 更新网格 当他们改变。 通过一个内容相同的新阵列或对象(在每个渲染点上重新创建的内在文字)不会重置任何东西:列保持用户所改变的宽度、顺序和能见度 groupBy 财务报告和审定财务报表 pivot 只在内容发生变化时再次应用;要取消用户更改的内容,请拨打API(resetColumnState(), (中文(简体) ), setGroupBy()) (中文(简体) ).

没有组件,请使用动作:

<script>
  import { freegrid } from '@freegridjs/svelte';
</script>

<div use:freegrid={{ columns, data: rows }} style="height: 400px"></div>

文档 : https://freegrid.app/docs/#svelte (英语)

许可证

核心网格(排序、过滤、编辑、选择、绑定列、页面和服务器行、 CSV 导出、, 印刷、主题、语言)对所有人免费,包括公司.

每个域进行30天的试验后,付费特性需要一个密钥:行分组和汇总、支点、图表、, 单元格区域选择、范围复制和粘贴、填充控件、Excel和PDF导出、工作簿、服务器侧组、, 高级过滤器、边栏面板、上下文菜单、摘要行、公式、查找、有条件的格式 和合并的细胞。 发展东道主(当地东道主、私人网络、当地网络、测试) 每一个特征.

• 个人、教育和非商业项目:免费个人钥匙,有效期6个月,可续用 任何时候,在 https://freegrid.app/license/ personal/ 互联网档案馆的存檔,存档日期2013-12-11
• 公司:每年每个域20万克朗,或40万克朗一次(长期更新,主要领域范围内更新) 已购买). 一个密钥覆盖了域及其所有子域.

见 https://freegrid.app/pricing/ 页面存档备份,存于互联网档案馆 还有LICENSE文件.

기본. 30分 30分 30分 30分 30分. 개인·교육·비영리 (6개월 (6개월 (언제든)) 를 (갱신) 회사는 (도메인당) 20만 (또는) 또는 (영구) 40만 (원) 라이선스를,키也. 자세한 https://freegrid.app/pricing/ 页面存档备份,存于互联网档案馆

import { setLicenseKey } from '@freegridjs/core';
setLicenseKey('FG1....');   // once for every grid on the page

或每个网格 : <FreeGrid licenseKey="FG1...." {columns} data={rows} />