自定义计算功能Sencha Touch

Question

我正在使用Sencha Touch 2.4，并且想在特定的显示卡上执行计算。 但是，是否可以在视图外部（可能在模型或控制器中）定义计算函数，以便在加载视图时仅调用该函数。

我当前在onActivate事件中调用myCalc函数，并且当前正在console.log()上的console.log()显示结果。

我的第一个问题是，是否可以在视图外部定义我的计算函数（在计算中使用几种方法），以便优化性能并在视图中调用带有方法的参数以通过参数方法进行计算？

function myCalc(method) {}

我的第二个问题是，如何在视图上显示我的计算结果，我设置了一个名为myID的ID，如何在ID的帮助下显示结果？

我的代码：

xtype: 'mycard',
config: {
        listeners: {
            activate: 'onActivate'
        },
        id: 'myID',
        styleHtmlContent: true
        ],
    }
 onActivate: function(me, container) {
 var results = new myCalc('METHOD1');
 console.log(results);
function myCalc(method) {...}
}

EDIT1：我在计算中使用GPS坐标。 我想将它们或结果设置到我的屏幕上。 我如何setHtml或获取locationupdate之外的坐标？

onActivate: function(me, container) {
    var geo = Ext.create('Ext.util.Geolocation', {
     autoUpdate: false,
     listeners: {
      locationupdate: function(geo) {
         var currentLat = geo.getLatitude();
         var currentLng =  geo.getLongitude();
         var PT = new Ext.util.Calc.myCal('METHOD1');
         var c = PT.setC([currentLat, currentLng]);
         //this.setHtml(c); // not working
         console.log(c);
      }
      }
    });
    geo.updateLocation();
}

Answer 1

有几种选择方法：

1. 如果存在模型实例，记录，则在卡后的某处，那么最简单，最有效，最优雅的方法是在模型级别将计算实现为计算字段 。 记录字段通常非常容易在视图中显示。
2. 您可以将函数实现为命名空间的方法，以便可以从任何地方调用它： MyApp.myCalc(arguments) 。 View（卡片）将监听激活事件，调用方法并显示结果。

Answer 2

您可以使用Ext.define在自己的类中定义函数，然后在整个应用程序中使用它，如下所示：

Ext.define("Calculator", {
   addition: function(num1, num2) {
       return num1 + num2;
   },
   subtract: function(num1, num2) {
       return num1 - num2;
   }
   ...
});

您可以在自己的文件中创建此文件，例如App.util.Calculator 。 您也可以将其用作mixin（ 此处的指南 ），以便可以将此功能添加到任何其他类中。

要更新卡片的结果，请使用以下方法：

items: [{
    title: 'Home',
    iconCls: 'home',
    html: 'Home Screen',
    listeners: {
        activate: function() {
            var calc = new Calculator();
            this.setHtml('2 + 3 = ' + calc.addition(2,3));
        }
    }
}]

编辑：这超出了您发布的代码的范围，请尝试这样的操作。

onActivate: function(me, container) {
    var that = this;
    var geo = Ext.create('Ext.util.Geolocation', {
     autoUpdate: false,
     listeners: {
      locationupdate: function(geo) {
         var currentLat = geo.getLatitude();
         var currentLng =  geo.getLongitude();
         var PT = new Ext.util.Calc.myCal('METHOD1');
         var c = PT.setC([currentLat, currentLng]);
         that.setHtml(c); // not working
         console.log(c);
      }
      }
    });
    geo.updateLocation();
}