无法在Ext JS中为TreeStore实现filterBy方法？

Question

我正在跟踪过滤TreePanel 小提琴 。 我的目的是根据登录帐户的username隐藏一些TreeStore项目。

我已经在我的应用程序的login方法上使用了小提琴，但是现在它显示了任何项目！ 如何克服这种情况？

login: function (username, password) {
        var me = this;
        var params = {
                // Headers
                'username': username,
                'password': password,
                ...
        };

        var loginReq = {...} // Saves token with a promise function 

        if (username === 'test@useradress.com') {
            var treeStore = Ext.getStore('navMenuTree');

            //debugger; //Error raises on here but doesn't give any error on console.
            treeStore.filterBy(function (item) {
                if (item.get('root') === true) return true;
                else if (item.get('visibleModule') === 1) return true;
                else return false;
            });
        }

        return loginReq;
    },

正如小提琴中提到的，我已经定义了TreeStore；

Ext.define('MyApp.store.NavMenuTree', {
    extend: 'Ext.data.TreeStore',
    alias: 'store.navmenutree',

    storeId: 'navMenuTree',
    fields: [{
        name: 'text'
    }],

    root: {
        expanded: true,
        defaultRootProperty: 'data',
        visibleModule: 1, //Here it is.
        data: [
                {
                 text: 'First Menu Item', //Which should be "visible"
                 visibleModule: 1,
                 iconCls: 'x-fa fa-thumbs-up',
                 expanded: false,
                 selectable: false,         

                 data: [
                     {
                        text: translations.dashboard,
                        iconCls: 'x-fa fa-area-chart',
                        viewType: 'dash',
                        leaf: true,
                        visibleModule: 1 // As well childrens should be visible
                     },
                     {
                        text: translations.bonus,
                        iconCls: 'x-fa fa-pencil-square-o',
                        viewType: 'bonuslist',
                        leaf: true,
                        visibleModule: 1 //Here also!
                     }
                 ]
                },
                {
                 text: 'Menu Item 2', //Which should be "hide"
                 visibleModule: 2,
                 iconCls: 'x-fa fa-usd',
                 expanded: false,
                 selectable: false,

                 data: [
                    {...}
                 ]
                },

Answer 1

rootProperty定义应位于商店的代理的读取器中

例如：

Ext.define('MyApp.store.NavMenuTree', {
  extend: 'Ext.data.TreeStore',
  alias: 'store.navmenutree',

  storeId: 'navMenuTree',
  proxy : {
    type: 'ajax',
    reader : {
        type: 'json',
       rootProperty : 'data'
    }
  }

Answer 2

我已经成功地通过提到的小提琴和我自己的结构过滤了项目。

引发该问题的唯一的事情就是storeId财产TreeStore 。 由于某种未知原因而被评论！ 如果未评论，则以某种方式删除了整个导航菜单项。

因此，我对此进行了评论，并在Ext.getStore()方法上使用了TreeStore自己的名称。 通过这种方式解决了问题，scenerio完美运行。

if (username === 'test@useradress.com') {
  //Updated only this part. In my case it's Ext.getStore('NavMenuTree')
  var treeStore = Ext.getStore('NameOfTreeStore');

  treeStore.filterBy(function (item) {
    if (item.get('root') === true) return true;
    else if (item.get('visibleModule') === 1) return true;
    else return false;
  });
}