1

テキストフィールドの変更イベントのイベント リスナーを追加したいと考えています。フォーム パネルを含むビューを作成しました。これまでのところ、すべてが機能しています。

ここで、テキストフィールドの 1 つにイベント リスナーを追加しようとしました。

  items:[
        {
            xtype    :"textfield",
            name     :"field",
            label    :"field",
            required :true,
            listeners:{
                change:{
                    fn    : "onChangeHandler",
                    scope: this
                },
            }
    },

しかし、それは実際には機能しません..何も起こりません。エラーも関数呼び出しもありません。私は何を間違っていますか？

編集：

別のことを試しました-アイテム定義内で直接：

    {
    xtype    :"textfield",
    name     :"field",
    label    :"field",
    required :true,
    listeners:{
        change:{
            fn    :this.onChange
        },
        scope :this
    }
},

しかし、変更すると、コンソールで次のエラーが発生しました。

キャッチされていない TypeError: 未定義のメソッド 'apply' を呼び出せません

4

3 に答える 3

2

'this'にはある種のスコープの問題があると思います。コントローラでイベントを処理する方がよい場合があります。ユーザー名のテキストフィールドにIDを追加し（id：'username'、）、コントローラーを使用してみてください。キーアップイベントとタップイベントのコールバックを受け取ります。変更コールバックの後にある種のエラーが発生しますが、起動します。また、キーアップのイベント名が間違っていました。Senchaは、各オブジェクトのすべてのイベントを一覧表示します。これは非常に役立ちます。

ここに画像の説明を入力してください

LoginController

Ext.define（ "App.controller.LoginController"、{
    拡張： "Ext.app.Controller"、

    構成：{
        参照：{
            ユーザー名：'#username'
        }、
        コントロール： {
            ユーザー名：{
                keyup：'onUsernameKeyUp'、
                変更：'onUsernameChange'
            }
        }
    }、
    onUsernameKeyUp：function（）{
        console.log（ "onUsernameKeyUp"）;
    }、
    onUsernameChange：function（）{
        console.log（ "onUsernameChange"）;
    }、
    起動：関数（）{
        this.callParent（）;
        console.log（ "launch"）;
    }、
    init：function（）{
        this.callParent（）;
        console.log（ "init"）;
    }
}）;

app.js-追加されたコントローラー：[]

Ext.application（{
    名前：「アプリ」、

    コントローラ：['LoginController']、
    phoneStartupScreen：'resources / reading / Homescreen.jpg'、
    TabletStartupScreen：'resources / reading / Homescreen〜ipad.jpg'、

    launch：function（）{
        var loginform = Ext.create（ "App.view.Login"）;

        Ext.Viewport.add（[loginform]）;
    }、
}）;
于 2012-05-25T16:59:56.407 に答える
2

これを変更してみてください：

listeners:{
                        change:{
                            fn    : "onChangeHandler",
                            scope: this
                        },
                    }

これに：

listeners:{
                        change: this.onChangeHandler
                    }

更新: 最も簡単な方法は、ID を設定することですapp.view.Login(たとえば、「abc」)。

fn: function() {Ext.getCmp('abc').onEvent();},
于 2012-05-25T14:20:44.033 に答える
0

「スコープ」を「変更」ブロックに入れる必要があります。

listeners:{
  change:{
    fn    :this.onChange,
    scope :this
  }
}

Uncaught TypeError: Cannot call method 'apply' of undefined あなたが書いたのでエラーがあります：

listeners:{
  change:{
    fn    :this.onChange
    },
    scope :this
}

違いがわかりますか？:)

また、リスナーを「config」ブロックに入れ、「config」ブロックの後に関数「onChange」を入れていることも確認してください。

于 2012-05-26T07:32:25.203 に答える