Sencha Touch 变量访问的问题

Question

我对使用 Sencha Touch 还是很陌生。我正在创建一个具有侧边栏和地图窗格的应用程序，当用户单击侧边栏区域中的“显示地图”按钮时，地图应该以该位置为中心。我遇到的问题是我不确定如何从处理函数访问 tpl 变量中的 {lat} 和 {lon} 属性。如果这是一个微不足道的问题，我很抱歉，但这让我很困惑。

Ext.define('Admin.view.Details',
{
extend: 'Ext.Panel',
xtype: 'details',

config:
{
    styleHtmlContent: true,
    scrollable: 'vertical',
    title: 'Individual',
    tpl:
    [
        'Account Number: {comid}',
        '<br />',
        'Address: ',
        '{address} <br />',
        '{lat},{lon}',
    ],

    items:
    [
        {
            title: 'Utilities',
            items:
            [
                {
                    xtype: 'selectfield',
                    label: 'Utility Type',
                    options: 
                    [
                        {text: 'Electricity', value: 'U1'},
                        {text: 'Water', value: 'U2'},
                        {text: 'Gas', value: 'u3' },
                    ],

                    id: 'utilityType',
                },
                {
                    xtype: 'selectfield',
                    label: 'Coverage Area',
                    options: 
                    [
                        {text: 'Subdivision', value: 'a1'},
                        {text: 'Zipcode', value: 'a2'},
                        {text: 'County', value: 'a3' },
                    ],

                    id: 'areaType',
                },
                {
                    xtype: 'button',
                    text: 'Show Map',
                    ui: 'round',
                    padding:3,
                    margin:10,
                    id:  'mapsBTN',
                    handler: function() {

                        olMap.setCenter(new OpenLayers.LonLat(lon, lat).transform
                        (
                            new OpenLayers.Projection("EPSG:4326"),
                            olMap.getProjectionObject()
                        ), 16);

                    }
                },
            ]
        },
    ]
}
});

Answer 1

您需要通过添加对视图和按钮的引用在视图的控制器中实现 de 处理程序，然后为按钮的 itemtap 事件添加侦听器，或者在视图的构造函数方法中实现它：

Ext.define('Admin.view.Details',{
  extend: 'Ext.Panel',
  xtype: 'details',

  config:{
    ...
  },

  constructor: function() {
    this.callParent(arguments);

    var me = this;

    this.child('#mapsBTN').setHandler(function() {
      me.getTpl(); // Here's your tpl config object
    });
  }
});

希望这有帮助

Answer 2

您可以通过 getter 获取配置对象中的任何变量。

this.getTpl(); //returns tpl variable

还要注意this 必须指向您的Admin.view.Details 视图。