如何防止在页面加载时调用带参数的函数?
How to prevent function with parameters from being called on page load?
我有一个在单击按钮后调用的函数。看起来像这样
<button class=".." data-bind="click: $root.openModal">
现在我正在尝试将参数传递给此函数。导致此代码
<button class=".." data-bind="click: $root.openModal(Object.Keys(params))">
参数已成功传递,但现在每当我加载页面时,甚至在单击按钮之前,都会调用 openModal 函数。即使我离开 '()' 而不是 openModal(Object.Keys(params)).
也会发生同样的情况
函数本身,看起来像这样
self.openModal = function (keys) {
popupObservable(true);
self.modal = $.openModalDefault({
url: '#js-confirmation-dialog-template',
className: 'doc',
onLoad: function () {
popupObservable(false);
if (!$(selectors.confirmationModal)[0]) {
return;
}
var viewModel = new ConfirmationDialogViewModel(function () {
self.confirm(keys);
self.modal.close();
}, "This part is irrelevant");
ko.applyBindings(viewModel, $(selectors.confirmationModal)[0]);
}
});
};
openModal 和 openModal() 之间有什么区别,如何将参数传递给此函数而不在页面加载时触发它?
那是因为您是在 data-bind="click: $root.openModal(Object.Keys(params))"
上调用该函数,而不是您想使用这些参数动态构建一个函数并在单击时执行它。
self.openModalWithParam = function (keys) {
// keys come from the outer function and returns a function for those values
return function () {
popupObservable(true);
self.modal = $.openModalDefault({
url: '#js-confirmation-dialog-template',
className: 'doc',
onLoad: function () {
popupObservable(false);
if (!$(selectors.confirmationModal)[0]) {
return;
}
var viewModel = new ConfirmationDialogViewModel(function () {
self.confirm(keys);
self.modal.close();
}, "This part is irrelevant");
ko.applyBindings(viewModel, $(selectors.confirmationModal)[0]);
}
});
};
};
或者,您可以只传递一个函数文字作为点击处理程序:
<button data-bind="click: () => $root.openModal(Object.Keys(params))">
我个人更喜欢哪个,因为这意味着您不必复制 openModal
函数。
我有一个在单击按钮后调用的函数。看起来像这样
<button class=".." data-bind="click: $root.openModal">
现在我正在尝试将参数传递给此函数。导致此代码
<button class=".." data-bind="click: $root.openModal(Object.Keys(params))">
参数已成功传递,但现在每当我加载页面时,甚至在单击按钮之前,都会调用 openModal 函数。即使我离开 '()' 而不是 openModal(Object.Keys(params)).
也会发生同样的情况函数本身,看起来像这样
self.openModal = function (keys) {
popupObservable(true);
self.modal = $.openModalDefault({
url: '#js-confirmation-dialog-template',
className: 'doc',
onLoad: function () {
popupObservable(false);
if (!$(selectors.confirmationModal)[0]) {
return;
}
var viewModel = new ConfirmationDialogViewModel(function () {
self.confirm(keys);
self.modal.close();
}, "This part is irrelevant");
ko.applyBindings(viewModel, $(selectors.confirmationModal)[0]);
}
});
};
openModal 和 openModal() 之间有什么区别,如何将参数传递给此函数而不在页面加载时触发它?
那是因为您是在 data-bind="click: $root.openModal(Object.Keys(params))"
上调用该函数,而不是您想使用这些参数动态构建一个函数并在单击时执行它。
self.openModalWithParam = function (keys) {
// keys come from the outer function and returns a function for those values
return function () {
popupObservable(true);
self.modal = $.openModalDefault({
url: '#js-confirmation-dialog-template',
className: 'doc',
onLoad: function () {
popupObservable(false);
if (!$(selectors.confirmationModal)[0]) {
return;
}
var viewModel = new ConfirmationDialogViewModel(function () {
self.confirm(keys);
self.modal.close();
}, "This part is irrelevant");
ko.applyBindings(viewModel, $(selectors.confirmationModal)[0]);
}
});
};
};
或者,您可以只传递一个函数文字作为点击处理程序:
<button data-bind="click: () => $root.openModal(Object.Keys(params))">
我个人更喜欢哪个,因为这意味着您不必复制 openModal
函数。