extjs 5: eine Datenbindung für die benutzerdefinierte Eigenschaft der Komponente machen

Question

Ich habe eine Komponente, die aus dem Dateifeld, erweitert und ich eine benutzerdefinierte Eigenschaft 'serverPath' hinzugefügt, und auch ich habe die Getter und Setter definiert.

Code:

Ext.define('MyApp.ux.Field.File',{ 
    extend:'Ext.form.field.File', 
    xtype:'myfilefield', 
    serverPath:'', 
    getServerPath:function(){ 
    return this.serverPath; 
}, 
setServerPath:function(serverPath){ 
    this.serverPath = serverPath; 
} 
}); 

Ext.create('MyApp.ux.Field.File',{ 
    bind:{ 
     serverPath:'{serverPath}' 
    }, 
    viewModel:{ 
     type:'myViewModel' 
    } 
}); 

ich werde nicht der Definition der myViewModel einfügen. es ist einfach.

und es stellte sich heraus, dass die Bindung nicht wirksam wird.

kann jemand helfen?

Answer 1

sollte Ihre Klasse:

Ext.define('MyApp.ux.Field.File',{ 
    extend:'Ext.form.field.File', 
    xtype:'myfilefield', 
    config: { 
    serverPath:'' 
    } 
}); 

Und Sie sollten alle gesetzt sein, weil ExtJS die Setter und Getter für Sie als auch die Setter erstellen. Ihrer Ansicht nach Modell stellen Sie sicher, Sie haben ein:

data: { 
    serverPath : 'yourPathGoesHere' 
} 

Herausgegeben Es gibt zwei Dinge, die fehlten:

1. Wenn ein Wert auf der Ansichtsmodell ändert sich die Änderungen durch die asynchron veröffentlicht Planer. Wenn Sie möchten, dass die Änderungen sofort angezeigt werden, müssen Sie notify auf dem ViewModel verwenden oder die Logik nach der Änderung etwas ändern.
2. Um benutzerdefinierte Konfigurationseigenschaften einer Klasse zu erhalten, um das ViewModel von Änderungen zu benachrichtigen, müssen Sie sie in der Konfigurationseigenschaft 'publish' hinzufügen. Bitte beachten Sie diese updated fiddle.