我需要Sencha Calculator实时工作方面的帮助


只怕再见是故人
2025-02-22 04:27:05 (21天前)

我正在尝试构建一个实时绑定数据的计算器,而无需用户按下“计算”按钮。到目前为止,我可以使我的应用程序正常工作,但用户必须单击“计算”按钮才能执行计算,这不是我想要的。我现在的问题是如何使我的计算器实时工作,这意味着一旦第一个,第二个和第三个文本字段被填充,第四个文本字段将自动生成答案,而无需按下计算按钮。1 + 1 + 1 =(3)一旦填充了前3个文本字段,则实时实时自动生成3。以下是到目前为止的代码:
<br/>Ext.define(“ikhlas.view.login”, {<br/>extend: ‘Ext.Panel’,<br/>xtype: ‘loginpanel’,</p> <pre><code>config:{ title: 'Login', iconCls: 'more', styleHtmlContent: true, layout:{ type: 'vbox', }, items: [ { xtype: 'container', iconCls: 'add', items: [ { xtype: 'textfield', name: 'email', id: 'txtField1', placeHolder: 'Sum 1' }, { xtype: 'spacer', height: 10, }, { xtype: 'textfield', name: 'password', id: 'txtField2', placeHolder: 'Sum 2' }, { xtype: 'spacer', height: 10, }, { xtype: 'textfield', name: 'password', id: 'txtField3', placeHolder: 'Sum 3' }, { xtype: 'spacer', height: 10, }, { xtype: 'textfield', id: 'txtField4', name: 'password', placeHolder: 'Sum 4' }, </code></pre><p>]},<br/> {<br/> xtype: ‘button’,<br/> text: ‘Calculate’,<br/> ui: ‘confirm’,<br/> width: ‘30%’,<br/> height: ‘6%’,<br/> flex: 1,<br/> left: ‘55%’,<br/> top: ‘65%’,<br/> action: ‘submitBtn’<br/> },</p> <pre><code>]} </code></pre><p>});<br/><code> 我的控制器看起来像这样: </code><br/>Ext.define(‘ikhlas.controller.SubmitController’,{<br/>extend: ‘Ext.app.Controller’,</p><p>config:{</p><p>refs:{<br/> submitBtn: ‘#submitBtn’,<br/> txtField1: ‘#txtField1’,<br/> txtField2: ‘#txtField2’,<br/> txtField3: ‘#txtField3’,<br/> txtField4: ‘#txtField4’<br/>},</p> <pre><code>control:{ 'button[action=submitBtn]':{ tap :'submitbutton' } } </code></pre><p>},</p><p>submitbutton:function(){</p> <pre><code>var value1 = Ext.getCmp('txtField1').getValue(); var value2 = Ext.getCmp('txtField2').getValue(); var value3 = Ext.getCmp('txtField3').getValue(); var value4; value4 = value1 * value2 * value3; Ext.getCmp('txtField4').setValue(value4); </code></pre><p>}<br/>});<br/>
到目前为止,该应用程序在代码给出方面运行良好,但是我需要实时计算才是我的目标。希望有人可以帮忙。我的商店和我的模型现在都空着。

2 条回复
  1. 1# 春风助手 | 2020-08-11 18-26

    我没有亲自尝试过,但是我认为您必须听听change文本字段的事件,并且每当值更改时,都必须重新计算该值。

    因此,对于您的每个输入文本字段,请将其添加到您的控制器中:

    1. control: {
    2. 'button[action=submitBtn]': {
    3. tap: 'submitbutton'
    4. },
    5. // this should call your submitbutton function which calculates the values
    6. // every time the value of textfield1 changes
    7. txtField1: {
    8. change: 'submitbutton',
    9. }
    10. }
登录 后才能参与评论