adopted-ember-addons / adopted-ember-addons/ember-light-table

Externally provided models

未關閉
#450 9 則留言 4 個 reaction 已指派 0 人 在 GitHub 檢視
cookbook help wanted
主要語言
JavaScript
星號
311
分支
130
PR 合併指標
30 天內沒有已合併 PR

描述

I had a quick chat with @shuriu in our #e-light-table Slack channel.

He asked what the preferred pattern for externally provided models is:

> hey, is there an accepted way to load the records from the route instead of the table component?
>I just realised that instatiating a table via `new Table(get(this, 'columns'), get(this, 'model'))`
> will not work :disappointed:

Depending on the scenario, there are two options I would suggest:

#### Computed Property

```js
model: null,

table: computed('model', function() {
return new Table(get(this, 'columns'), get(this, 'model'), { enableSync: true });
})
```

The obvious problem with this is, that whenever the `model` array changes (the reference / identity, not mutations), the `table` is re-created, thus losing all state.

#### `didReceiveAttrs` hook

```js
model: null,

table: null,

init() {
this._super(...arguments);

set(this, 'table', new Table(get(this, 'columns'), get(this, 'model') || []));
},

didReceiveAttrs: diffAttrs('model', function(changedAttrs, ...args) {
this._super(...args);

if (changedAttrs && changedAttrs.model) {
get(this, 'table').setRows(changedAttrs.model[1] || []);
}
}),
```

We're using the excellent [`ember-diff-attrs`](https://github.com/workmanw/ember-diff-attrs) here. The advantage with this pattern is, that the very same `table` is re-used throughout the lifespan of the component.

One drawback is that `enableSync` cannot be used. Once #414 is fixed, this is no problem any more.

貢獻指南

開啟貢獻指南

研究方向

Start by reading the issue discussion and the related #414, because the body describes possible patterns but not a concrete change. The relevant entry points mentioned are Table construction, setRows, enableSync, didReceiveAttrs, and ember-diff-attrs usage. Done is not well defined from the issue alone; it would need maintainer confirmation of whether this is docs or behavior support.

由索引模型根據 Issue 內容生成。

評估

技術堆疊
javascript
領域
frontend
Issue 類型
功能
難度
4/5
預估耗時
3-5 天
活躍度
停滯
描述清晰度
需要釐清
新手友好度
25/100

把新 issue 寄到你的電子郵件信箱

精選適合新手參與的 GitHub issue 摘要。