ember 如何使用制表符？

Question

我想将 http://tabulator.info/ 与 ember 一起使用。我不理解文档，也找不到任何关于 ember 配置的指南。我如何开始创建一个简单的 table?

Answer 1

查看网站上的示例，http://tabulator.info/，制表符似乎只需要一个元素即可工作（和一些配置）。

因此，我们的最终目标是使用 修饰符 并能够将制表符配置传递给它。

所以，这就是我们最终的结果：

<div {{tabulator someConfig}}></div>

现在，不幸的是，制表符在其构造函数中似乎只接受一个 id。所以我们需要将其动态添加到制表符中。

您要做的第一件事是安装 https://github.com/ember-modifier/ember-modifier（一定要阅读文档，因为这很有趣）

然后，在您的应用中创建一个文件，app/modifiers/tabulator.js

并使用这些内容：

import Modifier from 'ember-modifier';
import Tabulator from 'tabulator';
import { guidFor }  from '@ember/object/internals';

export default class TabulatorModifier extends Modifier {
  id = guidFor(this);

  get config() {
    return this.args.positional[0];
  }

  didInstall() {
    this.element.id = this.id;
    let config = th

    this.tabulator = new Tabulator(`#${this.id}`, this.config);
  }

  
}

然后也许在组件或控制器或其他东西中，你会有类似的东西：

export default class MyComponent extends Component {
  get myConfig() {
    return { ... };
  }
}

<div {{tabulator this.myConfig}}></div>

应该就是这样。您需要在 app.css

中导入 CSS

ember 如何使用制表符？

How to use tabulator with ember?

ember.js

tabulator