Sencha Touch Nestedlist 无法运行 getDetailCard

Question

我有以下 Sencha Touch2 的代码，当我运行它时，我收到类似

的错误

未捕获类型错误：无法读取未定义的属性“属性”

我见过许多与 getDetailCard 类似的代码。为什么我的无法获取“属性”属性？

Ext.define('MyApp.view.MainTabPanel', {
    extend: 'Ext.tab.Panel',

    config: {
        tabBar: {
            docked: 'top'
        },
        items: [
            {
                xtype: 'container',
                title: 'Documents'
            },
            {
                xtype: 'nestedlist',
                itemId: 'newslist',
                ui: 'dark',
                displayField: 'title',
                store: 'NewsStoreXML',
                title: 'News',
                getDetailCard: function(item, parent) {
                    var itemData = item.attributes.record.data,
                    parentData = parent.attributes.record.data,
                    detailCard = new Ext.Panel({
                        scroll: 'vertical',
                        styleHtmlContent: true,
                        tpl: ["<h2>{text}</h2>","{content}"]
                    });
                    detailCard.update(itemData);
                    this.backButton.setText(parentData.text);
                    return detailCard;
                }
            },
            {
                xtype: 'container',
                title: 'Calendar'
            }
        ]
    },
    requires: [
               'Ext.dataview.NestedList',
               'Ext.TitleBar'
           ]

});

Answer 1

我遇到了同样的错误。我修复了它，尝试类似的方法，用 if 语句包围您的代码，检查您的项目对象是否不为空。

getDetailCard: function(item, parent) {
    if(item) {
       // do some job on item object here...
       var itemData = item.attributes.record.data,
    }
    var parentData = parent.attributes.record.data,
    detailCard = new Ext.Panel({
        scroll: 'vertical',
        styleHtmlContent: true,
        tpl: ["<h2>{text}</h2>","{content}"]
    });
    detailCard.update(itemData);
    this.backButton.setText(parentData.text);
    return detailCard;
}

您可以通过 console.log(item) 来查看并了解它是如何构建的。对我来说，我可以获取文本，例如，通过获取 item.data.text。

Answer 2

首先您可能想使用：

this.backButton.setText(parentData.text);
==> useTitleAsBackText : true

getDetailCard 仅在您要切换到详细信息卡（永久保留树）时才为您提供一个“项目”，但每次在嵌套列表内切换时都会运行两次。

据我所知，您正在尝试设置项目的详细视图。为什么不使用正确的事件：

leafitemtap( this, list, index, target, record, e, eOpts )

当用户点击叶列表项时触发。

例如record.parentNode.getData().text

好处是，只有当您到达叶子时才会触发此操作，而不是每次在嵌套列表内切换列表时都会触发。