时间戳

首页 > 解决方案 > 仍在检索时导航时出现模型问题

ember.js - 仍在检索时导航时出现模型问题

问题描述

使用较旧的 ember 应用程序 (2.18.1)。以下问题重复了太多次，无法在我现在可用的时间范围内全部修复。

该组件正在加载它自己的数据（设置 this.get('model')）并且一切正常。

然而，由于数据库现在有点慢，用户有时会单击一个链接，模板在该链接呈现组件并开始加载它的数据。

如果用户单击另一个链接（指向完全相同的路由），来自先前组件和“新”组件的数据都会被加载。

加载数据时我无法重置模型，因为加载数据的 fetchRecord 方法会通过分页（当用户向下滚动时）一遍又一遍地调用。

我确定我只是没有想到一个明显的解决方案（几年没有在 Ember 上工作），有什么建议吗？

（ps：其中一些组件不使用分页，同时我将清除模型，然后再将其设置为 api 返回的内容）

标签： ember.js

解决方案

恐怕ember-data不支持中止请求，但您可以直接在通过Ajax或fetch调用端点的组件上自己处理，然后使用生命周期钩子推送有效负载或中止请求。例如，您可以触发挂机。abort()willDestroyElement

import $ from 'jquery';
import Component from '@ember/component';

export default Component.extend({
  init() {
    this._super(...argument);
    const xhr = $.get( "ajax/test.html", (data) => {
      this.get('store').pushPayload(data);
    });
    this.set('xhr', xhr);
  }

  willDestroyElement() {
    this._super(...argument);
    this.get('xhr').abort()
  }
});

推荐阅读