是否可以将查询存储在变量中?

时间:2019-07-09 13:40:02

标签: ember.js pagination ember-data

我实际上正在使用ember-simple-pagination。 它的工作原理很简单: -空疮 -根据实际页面获取数据

事实是过渡一点都不顺利,请自己看: https://streamable.com/sg6sg

有没有办法解决这个问题?我的想法对我说,这将是一种先获取数据,清空排序然后将数据推回存储库的解决方案。

import Component from '@ember/component';
import { computed } from '@ember/object';
import { sort } from '@ember/object/computed';
import { inject as service } from '@ember/service';

export default Component.extend({
  store: service(),
  posts: computed(function() {
    return this.get('store').peekAll('post');
  }),

  pageSize: 20,
  pageNumber: null,
  recordCount: null,

  sortProps: ['createdAt:desc'],
  sortedPosts: sort('posts', 'sortProps'),

  loadPosts(getPageNumber) {
    const pageSize = this.get('pageSize');

    this.get('store').unloadAll('post');
    this.get('store').
      query('post', {page: {number: getPageNumber, size: pageSize}}).
      then((result) => {
        this.setProperties({
            'recordCount': result.get('meta.record-count'),
            'pageNumber': getPageNumber
        });
      };
  },

  init() {
    this._super(...arguments);
    this.loadPosts(1);
  },

  actions: {
    getPage(getPageNumber) {
      this.loadPosts(getPageNumber);
    }
  }
});

1 个答案:

答案 0 :(得分:0)

Ola @elo,谢谢您的提问!

当前无法使用开箱即用的解决方案来执行此操作,但是我建议您查看路线的加载状态,以便在加载数据时向用户显示微调框或其他内容。它将使它的震动少一些。

如果您想了解如何设置简单的加载状态,可以按照以下指南进行操作:https://guides.emberjs.com/release/routing/loading-and-error-substates/#toc_loading-substates

当然,会有一种方法来实现您想要的,但是首先您将失去使用商店的某些功能,并且有人可能会争辩说,用户体验可能同样令人沮丧(数据不会按下按钮后突然改变)。我认为在您的情况下使用加载状态是最好的中间立场