javascript - 在 Knockout.js 和 Knockout.mapping.js 中使用脏标志或撤消堆栈

Question

我正在尝试创建或使用现有的 dirtyFlag。然而，我看到的所有示例都没有谈论如何将它们与 knockout.mapping.js 插件集成。

有很多非常棒的例子，比如 Ryan Niemeyer 的东西和 John Papa 的 KoLite，但它们都无法回答这个简单的问题

"I've got a lot of properties on my viewModel and I don't have time for hand coding something that should be handled by the knockout mapping plugin"

我觉得这是一个肮脏的(没有双关语意)小 secret ，需要公开。

谢谢!

Answer 1

我不是 knockout 库方面的专家，但我非常喜欢简单的解决方案。 KoLite 中的 John Papa 和 Hans Fjallemarks 解决方案:https://github.com/CodeSeven/kolite对于 View 模型中所有或选定的可观察对象的简单但最有效的脏标志，这是一个很好的解决方案。

我对它做了一些调整以包括撤消。

ko.DirtyFlag = function (objectToTrack, isInitiallyDirty, hashFunction) {

    hashFunction = hashFunction || ko.toJSON;

    var
        self = this,
        _objectToTrack = objectToTrack,
        _lastCleanState = ko.observable(hashFunction(_objectToTrack)),
        _isInitiallyDirty = ko.observable(isInitiallyDirty),

        result = function () {
            self.forceDirty = function () {
                _isInitiallyDirty(true);
            };

            self.isDirty = ko.computed(function () {
                return _isInitiallyDirty() || hashFunction(_objectToTrack) !== _lastCleanState();
            });

            self.reset = function () {
                _lastCleanState(hashFunction(_objectToTrack));
                _isInitiallyDirty(false);
            };

            self.undo = function () {
                var source = JSON.parse(_lastCleanState());
                for (prop in source) {
                    if (_objectToTrack[prop]() && _objectToTrack[prop]() != source[prop]) {
                        _objectToTrack[prop](source[prop]);
                    }
                }
                _isInitiallyDirty(false);
            };
            return self;
        };

    return result;
};