如何将 qooxdoo 属性 绑定到一个小部件?
How to bind qooxdoo property to a widget?
我对 Qooxdoo 完全陌生。
我想将 属性 绑定到标签,如下面的代码所示,但这不起作用:(
qx.Class.define("xxx.view.XxxView",
{
extend : qx.ui.container.Composite,
properties : {
CaseID : {
check : 'String',
event : 'changeCaseID',
init : '000000000'
}
},
members : {
_CaseIDLabel : null
},
construct : function()
{
this._CaseIDLabel = new qx.ui.basic.Label("initial");
this.CaseID.bind('changeCaseID', this._CaseIDLabel, 'value');
}
}
谢谢 4 个提示
您无法直接访问 属性。您必须使用 geters 和 setter 来访问它的值。您可以改为绑定整个 属性。绑定系统足够智能,可以检测发出的事件,提取 属性 的值并将其应用于目标。
这是一个工作代码
qx.Class.define("xxx.view.XxxView", {
extend : qx.ui.container.Composite,
construct : function() {
this.base(arguments);
this._CaseIDLabel = new qx.ui.basic.Label("initial");
// containers need a layout
this.setLayout(new qx.ui.layout.Canvas());
this.add(this._CaseIDLabel);
// notice here we are binding this object's property
this.bind('CaseID', this._CaseIDLabel, 'value');
},
properties : {
CaseID : {
check : 'String',
event : "changeCaseID",
init : '000000000'
}
},
members : {
_CaseIDLabel : null
},
});
这是游乐场示例
https://tinyurl.com/rt5v8zx
这是另一个稍微不同的例子。查看嵌入的评论。
qx.Class.define("xxx.view.XxxView",
{
extend : qx.ui.container.Composite,
properties : {
CaseID : {
check : 'String',
event : "changeCaseID",
init : '000000000'
}
},
members : {
_CaseIDLabel : null
},
construct : function()
{
// We need to call the superclass constructor.
// In this case, we also provide a layout for this container.
this.base(arguments, new qx.ui.layout.VBox());
// Here we instantiate a Label with initial text, but that text
// will be immediately overwritten so we'll never see it
this._CaseIDLabel = new qx.ui.basic.Label("initial");
this.add(this._CaseIDLabel);
// We can bind to our own property, as done here. Note, though,
// that this doesn't use the being-initialized value in the property
// without explicit instruction... so we then force-initialize that
// property.
this.bind('changeCaseID', this._CaseIDLabel, 'value');
this.initCaseID();
}
});
// Instantiate one of these xxxView objects, and place it on the page
var xxxView = new xxx.view.XxxView();
this.getRoot().add(xxxView, { left : 10, top : 200 } );
// Show how the property value can change later, and update the label
setTimeout(
function()
{
xxxView.setCaseID('Hello world!');
},
2000);
这个在游乐场可以看到运行:http://tinyurl.com/vml8bru
我对 Qooxdoo 完全陌生。
我想将 属性 绑定到标签,如下面的代码所示,但这不起作用:(
qx.Class.define("xxx.view.XxxView",
{
extend : qx.ui.container.Composite,
properties : {
CaseID : {
check : 'String',
event : 'changeCaseID',
init : '000000000'
}
},
members : {
_CaseIDLabel : null
},
construct : function()
{
this._CaseIDLabel = new qx.ui.basic.Label("initial");
this.CaseID.bind('changeCaseID', this._CaseIDLabel, 'value');
}
}
谢谢 4 个提示
您无法直接访问 属性。您必须使用 geters 和 setter 来访问它的值。您可以改为绑定整个 属性。绑定系统足够智能,可以检测发出的事件,提取 属性 的值并将其应用于目标。
这是一个工作代码
qx.Class.define("xxx.view.XxxView", {
extend : qx.ui.container.Composite,
construct : function() {
this.base(arguments);
this._CaseIDLabel = new qx.ui.basic.Label("initial");
// containers need a layout
this.setLayout(new qx.ui.layout.Canvas());
this.add(this._CaseIDLabel);
// notice here we are binding this object's property
this.bind('CaseID', this._CaseIDLabel, 'value');
},
properties : {
CaseID : {
check : 'String',
event : "changeCaseID",
init : '000000000'
}
},
members : {
_CaseIDLabel : null
},
});
这是游乐场示例 https://tinyurl.com/rt5v8zx
这是另一个稍微不同的例子。查看嵌入的评论。
qx.Class.define("xxx.view.XxxView",
{
extend : qx.ui.container.Composite,
properties : {
CaseID : {
check : 'String',
event : "changeCaseID",
init : '000000000'
}
},
members : {
_CaseIDLabel : null
},
construct : function()
{
// We need to call the superclass constructor.
// In this case, we also provide a layout for this container.
this.base(arguments, new qx.ui.layout.VBox());
// Here we instantiate a Label with initial text, but that text
// will be immediately overwritten so we'll never see it
this._CaseIDLabel = new qx.ui.basic.Label("initial");
this.add(this._CaseIDLabel);
// We can bind to our own property, as done here. Note, though,
// that this doesn't use the being-initialized value in the property
// without explicit instruction... so we then force-initialize that
// property.
this.bind('changeCaseID', this._CaseIDLabel, 'value');
this.initCaseID();
}
});
// Instantiate one of these xxxView objects, and place it on the page
var xxxView = new xxx.view.XxxView();
this.getRoot().add(xxxView, { left : 10, top : 200 } );
// Show how the property value can change later, and update the label
setTimeout(
function()
{
xxxView.setCaseID('Hello world!');
},
2000);
这个在游乐场可以看到运行:http://tinyurl.com/vml8bru