我想使用 knockout “事件”绑定(bind)将一些事件绑定(bind)到一个元素
但我希望所有列出的事件仅与特定案例绑定(bind)。
View 模型:
function vm(){
var self = this;
self.isEditMode = ko.observable(false);//can be changed to true
self.events = ko.observable({
down: function () {
console.log("down")
},
up: function () {
console.log("up")
},
hover: function () {
console.log("hover")
}
});
}
和HTML:
<div style="border:1px solid red;width:50px;height:50px"
data-bind="event:{mousedown:events().down,mouseup:events().up,mouseover:events().hover}:null"></div>
<button data-bind="click:function(){isEditMode(!isEditMode())}">change </button>
我试过:
<div data-bind="event:isEditMode()?{mousedown:events().down,mouseup:events().up,mouseover:events().hover}:null"></div>
但这对我不起作用。
我认为最好的方法是使用自定义 bindingHandlers,但我不知道如何。
非常感谢您的帮助!
最佳答案
您可以通过将一些逻辑移动到 View 模型中来简化绑定(bind)
<div style="border:1px solid red;width:50px;height:50px"
data-bind="event: {
mousedown: down,
mouseup:up,
mouseover:hover }" > </div>
并像这样查看模型
function vm() {
var self = this;
this.isEditMode = ko.observable(true);
down = function() {
if(this.isEditMode())
{
console.log("down")
}
};
up = function() {
if(this.isEditMode())
{
console.log("up")
}
};
hover = function() {
if(this.isEditMode())
{
console.log("hover")
}
};
}
var viewModel = new vm();
ko.applyBindings(viewModel);
关于mvvm - 带有条件的 knockout 事件绑定(bind),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48971403/