[英]Vuejs , set input value bound to a model from chrome inspector console
[英]ExtJS 5: Set child View Model data from bound value
我有一個具有自己的視圖模型的類,並在主視圖中創建了該類的2個實例。 在主視圖中,我想傳遞2個類實例的值,但似乎無法正常工作……我想我只是不了解一些非常簡單的概念。
預期的結果是value1 + value2字段具有value1和value2的串聯,第一個myValue顯示value1,第二個myValue顯示value2。 這是我的代碼和示例 :
Ext.application({
name: 'Fiddle',
launch: function() {
Ext.define('MyViewModel', {
extend: 'Ext.app.ViewModel',
alias: 'viewmodel.myView',
formulas: {
doSomething: function(getter) {
console.log(getter('value1'), getter('value2'));
return getter('value1') + getter('value2');
}
}
});
Ext.define('MyView', {
extend: 'Ext.panel.Panel',
xtype: 'myView',
viewModel: {
type: 'myView'
},
config: {
myValue: null
},
publishes: {
myValue: true
},
items: [
{
xtype: 'displayfield',
fieldLabel: 'myValue',
bind: {
value: '{myValue}'
}
}
]
});
Ext.create('Ext.container.Container', {
renderTo: Ext.getBody(),
items: [
{
xtype: 'displayfield',
fieldLabel: 'display',
bind: {
value: '{doSomething}'
}
},
{
xtype: 'myView',
reference: 'view1',
title: 'View1',
bind: {
myValue: '{value1}'
}
},
{
xtype: 'myView',
reference: 'view2',
title: 'View2',
bind: {
myValue: '{value2}'
}
}
],
viewModel: {
data: {
value1: 'Something',
value2: 'something else'
}
}
})
}
});
您的第一個displayField永遠不會“看到” doSomething公式,因為該公式不是其父級的一部分,因此您需要將公式從MyViewModel
移至Ext.container.Container
viewModel。
另外,發布自定義值時,它將具有reference.publishedvalue
格式。 這應該可以修復您的面板:
Ext.application({
name: 'Fiddle',
launch: function() {
Ext.define('MyViewModel', {
extend: 'Ext.app.ViewModel',
alias: 'viewmodel.myView'
});
Ext.define('MyView', {
extend: 'Ext.panel.Panel',
xtype: 'myView',
viewModel: {
type: 'myView'
},
config : {
myValue : null
},
publishes : ['myValue'],
items: [{
xtype: 'displayfield',
fieldLabel: 'myValue',
initComponent : function() {
var me = this,
owner = me.$initParent || me.initOwnerCt;
this.setBind({
value: '{' + owner.reference + '.myValue}'
});
this.callParent();
}
}]
});
Ext.create('Ext.container.Container', {
renderTo: Ext.getBody(),
viewModel: {
data: {
value1: 'Something',
value2: 'something else'
},
formulas: {
doSomething: function(getter) {
console.log(getter('value1'), getter('value2'));
return getter('value1') + getter('value2');
}
}
},
items: [{
xtype: 'displayfield',
fieldLabel: 'display',
bind: {
value: '{doSomething}'
}
},{
xtype: 'myView',
reference: 'view1',
title: 'View1',
bind: {
myValue: '{value1}'
}
},{
xtype: 'myView',
reference: 'view2',
title: 'View2',
bind: {
myValue: '{value2}'
}
}]
})
}
});
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.