Question

我实际上正在使用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);
    }
  }
});

Answer 1

Ola @elo，谢谢您的提问！

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

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

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

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

1 个答案: