1

コントローラーから既存のビューにデータを渡そうとしています。以下を試しましたが、どれも機能していません。既存のパネルに表示できるようにデータを渡したいです。

コントローラから

1. Ext.Viewport.setActiveItem('profileinfo');
   Ext.Viewport.setData(record.data);

2. Ext.Viewport.setActiveItem('profileinfo').setData(record.data);

3. Ext.Viewport.setActiveItem('profileinfo', {data:record.data});

4. Ext.Viewport.setActiveItem({ xtype:'profileinfo', data:record.data});

があり、データの一部として表示されてprofileinfoいるパネルはどこですかtitlebartitle{member_data}

loadList:function(me, index, target, record, e, eOpts){


        console.log(record.data.member_name);

            Ext.Viewport.setActiveItem({ 
                xtype:'profileinfo', 
                data:record.data}
            );



    }

profileinfo使用可能なパネルのinitialize機能を確認dataできますが、使用してアクセスできません{member_name}

initialize: function(){
       this.callParent();

       console.log("initialized");
       console.log(this.config.data); // able to see the data 
    }

しかし、データはパネルに反映されません

  {

        xtype:'titlebar',
        title:'{member_name}' // its displaying {member_name} text rather then data itself


    }

アップデート

ここにprofileinfoコードがあります

 Ext.define('demo.view.ProfileInfo', {
        extend: 'Ext.form.Panel',
        xtype: 'profileinfo',
        requires: [ 'Ext.TitleBar','demo.view.ProfileMemberInfo'],
        config: {


            layout:'vbox',


            items: [

            {
                xtype: 'titlebar',
                title: 'demo',
                cls: 'bms-bg-head',
                height:'65px',
                center:true,
                html:'<div class="demo-mini-logo"></div>'
            },{




                    xtype:'label',
                    // nothing is visible here
                    html:'{member_name}'



            }]
        },

        initialize: function(){
           this.callParent();

           //  record is visible
           console.log(this.config.record);





    }

});

ここにコントローラーコードがあります

loadList:function(me, index, target, record, e, eOpts){



            Ext.Viewport.setActiveItem({ 
                xtype:'profileinfo', 
                record:record
                }
            );





    }
4

1 に答える 1

3

パネルのinitializeメソッドでデータを取得すると言いましたので、これを行うことができます

initialize: function(){
       this.callParent();
       console.log("initialized");
       var data = this.config.data;
       this.down('titlebar').setTitle(data.member_data);
}

コメントに基づいて、setRecordパネルにデータを設定できます。

アップデート

コントローラーで formPanel への参照を持っている

config : {
        refs : {
            Profileinfo: 'profileinfo'
        }
    }

ProfileInfo ビューで

ラベルを選択するには、このように itemId をラベルに指定することをお勧めします

{ 
  xtype:'label',
   itemId: 'member'
}

コントローラーの loadList 関数で

formpanel 内にフィールド (textfield、selectfield など) がある場合は、setValues()以下のようにデータの設定に使用できます。

ただし、ラベルはフィールドではないため、それを選択してから使用setHtml()してデータを設定する必要があります

loadList:function(me, index, target, record, e, eOpts){

 Ext.Viewport.setActiveItem({ xtype:'profileinfo'});

 this.getProfileinfo().setValues(record.getData());

 //As you posted in your question, I am assuming member label is child of Profileinfo
 this.getProfileinfo().getComponent('member').setHtml(record.getData().member_name)

}

最も重要な

のプロパティまたはフィールドrecordは frompanel のフィールドの名前と一致する必要があります. その場合にのみsetValues()機能します.

例

frompanel にこのようなフィールドがある場合

 {
   xtype: 'textfield',
   label: 'First Name',
   name: 'Firstname'
 }

record.getData()プロパティが含まれている必要がありFirstnameます。

tpl を使用したパネルの設定データの更新

このようなパネルがあるとしましょう

Ext.define('MailApp.view.MessageDetails', {
    extend: 'Ext.Panel',
    xtype: 'messageDetails',   
    config: {
        items : [{
                 xtype: 'titlebar',
                 docked: 'top',
                 itemId: 'detailsTitle'
              },
            {
            xtype : 'panel',
            itemId : 'details',
            tpl : new Ext.Template(
            '<div class="details">',
            '<p>From : {from}</p>',
            '<p>Subject : {subject}</p>',
            '<p>Message : {message}</p>',                   
            </div>'
            )
        }]
    }
});

コントローラーの loadList 関数で

loadList:function(me, index, target, record, e, eOpts){
 var data = record.getData();

 Ext.Viewport.setActiveItem({ xtype:'messageDetails'});

 // Don't forget to put refference to work this.getMessageDetails()

 this.getMessageDetails().getComponent('details').setData(data);

 this.getMessageDetails().getComponent('detailsTitle').setHtml(data.detailsTitle)

}

console.log(record.data()) を印刷すると、

Object {from: "Apple", subject: "welcome", message: "Apple welcomes you to mail app", detailsTitle: " Mail Deatils", id: "ext-record-1", xindex: 1}

つまり、プロパティは tpl のフィールドと一致する必要があります。

これは、tpl を使用してパネルのカスタム HTML にデータを設定するために実行できることです。

于 2013-08-03T10:29:17.080 に答える