自定義計算功能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();
}