ExtJS 5/6. 내 사용자 지정 개체 구성 특성을 바인딩 할 수있게 만드는 방법? <pre><code>Ext.define('A', { config: { b: 1 }, constructor: function(config) { this.initConfig(config); return this; } }) ; </code></pre> <p></p>가 나는 뷰 모델 생성 :

Question

가 나는 설정 속성 b와 함께 사용자 지정 개체 A이

viewModel: { 
    data: { 
     a: Ext.create('A') 
    } 
}, 

을하지만,이 바인딩 작동하지 않습니다 :

items: [ 
    { 
     xtype:'textfield', 
     bind:'{a.b}' 
    }, 

나는 무엇이다 잘못하고있는거야? https://fiddle.sencha.com/#view/editor&fiddle/27qp

- 업데이트 : 나는 예제이 바이올린을 쓴 내가 코드를 축소 된,하지만 내 실제 뷰 모델에 내가 몇 가지 설정 변수와 객체를 가지고 있다는 사실을 놓친, 나는 것에 대해 생각하고 그것을 뷰 모델과 동기화하고 뷰와 동기화하십시오. 구성 요소에 '참조'가있을 때처럼.

감사합니다.

Answer 1

property와 config의 차이점은 클래스 인스턴스로 속성을 호출 할 수 있다는 것입니다. 반면 config는 해당 클래스가 Ext.Base으로 확장 될 때만 setter와 getter로 호출해야합니다. 합니다 (Ext.Base 클래스 constructor은 자리 표시 자입니다. 당신이 Ext.Component에서 클래스를 확장하는 경우는, 따라서. 구성 요소에 대한 모든 작업을 수행하는 Ext.Component 생성자의 필요에 따라 동일한 코드가 작동합니다.)

자,이를 만들기 위해 코드가 작동, 우리는 다음과 같이 수정해야합니다 :

Ext.define('A', { 
    config: { 
    b: 1 
    }, 
    constructor: function (config) { 
    this.initConfig(config); 
    return this; 
    } 
}); 

var objA = Ext.create('A'); 

Ext.create('Ext.window.Window', { 
    title: 'Example', 
    viewModel: { 
    data: { 
     //a: Ext.create('A'), 
     x: objA.getB(), 
    } 
    }, 
    width: 400, 
    layout: 'vbox', 
    items: [{ 
    xtype: 'textfield', 
    reference: 'mytextfield', 
    bind: '{x}' 
    }, { 
    xtype: 'button', 
    text: 'show a.b value', 
    handler: function (button) { 
     alert(this.lookupViewModel().get('x')); 
    } 
    }] 
}).show(); 

나는 당신의 code로 변경했습니다. 희망이 좀 도움이됩니다.

Answer 2

Ext.Class.config은 자동으로 getter 및 setter 메서드를 만드는 데 사용되지만 A.b 클래스 속성 자체를 생성합니다 (여전히 A.config.b).

문제는 Ext.mixin.Bindablebind 또는 publishes 내부 getter와 setter 메소드를 sertain하지, Ext.app.ViewModel 일반적인 get(path) 및 set(path, value) 방법을 사용한다는 것입니다, 그래서 정확히 A.b하지 A.getB() 사용하려고합니다.

이 아닌 b 속성을 클래스 자체에 추가하거나 Ext.app.ViewModel.formulas을 사용해야합니다.

체크 this fiddle.

A.config.b도 {xtype: 'textfield', bind: '{a.config.b}'}과 같이 사용할 수 있습니다.