我使用dojox.mvc.at将dojox.mobile.Switch的value属性绑定到模型中的属性。当我在模型中更改属性时，Switch会响应更改;但是当我改变了switch的状态时，模型中的属性没有得到更新。
dojox.mobile.DatePicker的问题也一样。
我正在使用dojo 1.9.0
任何人都可以帮忙解决这个问题吗？
<div class="row">
<label for="switch"></label>
<div id="switch" data-dojo-type="dojox.mobile.Switch" data-dojo-props="leftLabel: 'ON',rightLabel: 'OFF', value: at(appContent,'switch')" onStateChanged="alert(this.value)"></div>
</div>
我的mdoel对象是
require(["dojox/mvc/getStateful",
"dojox/mobile/TextBox",
"dojox/mobile/ValuePickerDatePicker",
"dojox/mobile/DatePicker",
"dojox/mobile/Opener",
"dojox/mobile/TabBarButton",
"dojox/mobile/RadioButton",
"dojox/mobile/TextArea",
"dojox/mobile/Slider",
"dojox/mvc/Output",
"dojox/mobile/Switch"],
function(getStateful){
var data={
'switch':'on'
};
appContent=getStateful(data);
});
答案 0 :(得分：0)
这些小部件有不同的问题。 dojox/mobile/Switch类由dojo/_base/declare组成的方式不适用于dojox/mvc扩展dijit/_WidgetBase的方式，dojox/mobile/Switch是大多数小部件的基类。您需要明确将扩展名应用于dojox/mobile/DatePicker以解决该问题，例如：
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/dojo/1.9.1/dojox/mobile/deviceTheme.js" data-dojo-config="mblThemeFiles: ['base']"></script>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/dojo/1.9.1/dojo/dojo.js" data-dojo-config="async: 1, parseOnLoad: 0"></script>
<script type="text/javascript">
require([
"dojox/mvc/atBindingExtension",
"dojox/mobile/Switch"
], function(atBindingExtension, Switch){
atBindingExtension(Switch.prototype);
require([
"dojo/Stateful",
"dojox/mvc/at",
"dojox/mobile/parser",
"dojox/mvc/Output"
], function(Stateful, at, parser){
window.at = at;
window.model = new Stateful({
state: "off"
});
parser.parse();
});
});
</script>
</head>
<body>
<div data-dojo-type="dojox/mobile/Switch" data-dojo-props="value: at(model, 'state')"></div>
<div>Switch state: <span data-dojo-type="dojox/mvc/Output" data-dojo-props="value: at(model, 'state')"></span></div>
</body>
</html>
{{3}}不会将用户的输入发送回value属性。您需要观察每个广告位的更改并手动更新value属性以解决此问题：
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/dojo/1.9.1/dojox/mobile/deviceTheme.js" data-dojo-config="mblThemeFiles: ['base', 'DatePicker']"></script>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/dojo/1.9.1/dojo/dojo.js" data-dojo-config="async: 1, parseOnLoad: 0"></script>
<script type="text/javascript">
require([
"dojo/_base/array",
"dojo/aspect",
"dojo/date/locale",
"dojo/date/stamp",
"dojo/Stateful",
"dojox/mvc/at",
"dojox/mobile/parser",
"dojox/mobile/DatePicker",
"dojox/mvc/Output"
], function(array, aspect, locale, stamp, Stateful, at, parser, DatePicker){
window.at = at;
window.model = new Stateful({
date: stamp.toISOString(new Date())
});
aspect.after(DatePicker.prototype, "startup", function(){
var self = this,
slots = this.slots;
array.forEach(slots, function(slot){
self.own(slot.watch("value", function(){
var pattern = slots[0].pattern + "/" + slots[1].pattern + "/" + slots[2].pattern;
self._set("value", stamp.toISOString(locale.parse(slots[0].get("value") + "/" + slots[1].get("value") + "/" + slots[2].get("value"), {datePattern: pattern, selector: "date"})));
}));
});
});
parser.parse();
});
</script>
</head>
<body>
<div data-dojo-type="dojox/mobile/DatePicker" data-dojo-props="value: at(model, 'date')"></div>
<div>Date picker value: <span data-dojo-type="dojox/mvc/Output" data-dojo-props="value: at(model, 'date')"></span></div>
</body>
</html>
希望这有帮助。
最好， - Akira
答案 1 :(得分：0)
我尝试了你为dojox.mobile.Switch提到的更改，但它无法正常工作。它仍然是一种绑定方式（从模型到视图）而不是视图模型。我浏览了Switch.js文件，发现更新'value'属性的方式不是mvc触发的方式。我手动在dojox / mobile / Switch.js中添加了三行代码，在_onClick函数中添加了两行代码，在_changeState中添加了一行代码，并且交换机与mvc和mvc一起工作正常。这些变化是否有效？
_changeState: function(/*String*/state, /*Boolean*/anim){
this._set（“value”，state）; * /由我添加* /
var on = (state === "on");
this.left.style.display = "";
this.right.style.display = "";
this.inner.style.left = "";
if(anim){
domClass.add(this.switchNode, "mblSwitchAnimation");
}
domClass.remove(this.switchNode, on ? "mblSwitchOff" : "mblSwitchOn");
domClass.add(this.switchNode, on ? "mblSwitchOn" : "mblSwitchOff");
domAttr.set(this.switchNode, "aria-checked", on ? "true" : "false"); //a11y
var _this = this;
_this.defer(function(){
_this.left.style.display = on ? "" : "none";
_this.right.style.display = !on ? "" : "none";
domClass.remove(_this.switchNode, "mblSwitchAnimation");
}, anim ? 300 : 0);
}
_onClick: function(e){
// summary:
// Internal handler for click events.
// tags:
// private
if(e && e.type === "keydown" && e.keyCode !== 13){ return; }
if(this.onClick(e) === false){ return; } // user's click action
if(this._moved){ return; }
// this.value= this.input.value= (this.value == "on") ? "off" : "on"; removed by me
this.input.value = (this.value == "on") ? "off" : "on"; //added by me
this._set('value', this.input.value); //added by me
console.log("clicked and this.value "+this.value);
this._changeState(this.value, true);
this.onStateChanged(this.value);
}
我检查过两次，没有正常行为的问题，也可以使用mvc。如果这些更改有效，请在下一版本中进行这些更改以支持mvc。