Question

我有一个自定义处理程序，用于获取radiobutton检查值：

export const radioChecked = {
    init: function (element, valueAccessor, allBindingsAccessor,
        viewModel, bindingContext) {
        var value = valueAccessor();
        var newValueAccessor = function () {
            return {
                change: function () {
                    value(element.value);
                }
            }
        };
        ko.bindingHandlers.event.init(element, newValueAccessor,
            allBindingsAccessor, viewModel, bindingContext);
    },
    update: function (element, valueAccessor, allBindingsAccessor,
        viewModel, bindingContext) {
        if ($(element).val() == ko.unwrap(valueAccessor())) {
            setTimeout(function () {
                $(element).closest('.btn').button('toggle');
            }, 1);
        }
    }
};

我正在我的viewmodel中导入并注册它：

let ko = require('knockout');
let radioChecked = require('../general/handler/radioChecked');

(function () {
    ko.bindingHandlers.radioChecked = radioChecked;

    var ViewModel = function () {
        var self = this;

        self.currentView = ko.observable();
    }

    var viewModel = new ViewModel();
    ko.applyBindings(viewModel);
})();

活页夹仅适用于初始加载，但是，单击单选按钮时，不会触发活页夹更新。

这是工作文件，然后转移到webpack + babel-loader。

有人知道如何在使用Webpack加载模块时使KO自定义绑定器工作吗？

Answer 1

我有一个名为knockout-bindings.js的文件。我的所有自定义绑定都在该文件夹中

// -- Contents of knockout-bindings.js -- //
var ko = require('knockout');

ko.bindingHandlers.datePicker = {...}
ko.bindingHandlers.editableText = {...}
ko.bindingHandlers.numericText = {...}

然后在webpack源码app.js中，我只是在文件顶部做了直接请求。无需在那里设置对象。

const ko = require('knockout');
require('./assets/js/knockout-bindings.js')

(function () {
    var ViewModel = function () {
        var self = this;

        self.currentView = ko.observable();
    }

    var viewModel = new ViewModel();
    ko.applyBindings(viewModel);
})();

你的包含应该使用 const 而不是让，这不应该是他们会改变的原因。

使用webpack时自定义处理程序无法正常工作

1 个答案: