sencha-touch - 在不同视口之间传递数据

Question

在我的程序中，有一个带有两个 TextField 和一个 Button 的“屏幕”。

按钮有这个监听器；

listeners: {
    tap: function (as, e, eOpts ) {
        Ext.Viewport.animateActiveItem({xtype: 'clientlist'},{ type:'flip'})},
    },
}

所以按下按钮我转到另一个屏幕......</p>

在第二个屏幕中，我想使用一个标签来查看我在第一个屏幕中写的单词。那么我如何在新屏幕中移植文本（在第一个屏幕的文本字段中）？

多谢！

Answer 1

遵循 MVC 格式：

看法：

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

    config: {
        items: [
            {
                xtype: 'textfield',
                itemId: 'textField1',
                label: 'Field'
            },
            {
                xtype: 'textfield',
                itemId: 'textField2',
                label: 'Field'
            },
            {
                xtype: 'button',
                itemId: 'mybutton1',
                text: 'click me'
            },
            {
                xtype: 'titlebar',
                docked: 'top',
                title: 'First Screen'
            }
        ]
    }

});    

// Client List (Second Screen)
Ext.define('MyApp.view.ClientList', {
    extend: 'Ext.Panel',
    alias: 'widget.clientlist',

    config: {
        itemId: 'clientList',
        items: [
            {
                xtype: 'titlebar',
                docked: 'top',
                title: 'Client List'
            }
        ]
    }

});

控制器：

Ext.define('MyApp.controller.MyController1', {
    extend: 'Ext.app.Controller',

    config: {
        refs: {
            textField1: '#textField1',
            textField2: '#textField2',
            clientList: {
                autoCreate: true,
                selector: '#clientList',
                xtype: 'clientlist'
            }
        },

        control: {
            "button#mybutton1": {
                tap: 'onMybutton1Tap'
            }
        }
    },

    onMybutton1Tap: function(button, e, options) {
        var me  = this,
            clientList = me.getClientList(),
            textField1_val = me.getTextField1().getValue(),
            textField2_val = me.getTextField2().getValue();

        Ext.Viewport.animateActiveItem(clientList,{ type:'flip'});

        // Do what you need to do with the values from your 
        // first screen in your client list
        clientList.setHtml('textField1_data: '+textField1_val+'<br>textField2_data: '+ textField2_val);
    }
});