3

以保持事物干燥的名义,我想问一下尝试避免声明重复属性时的典型方法是什么。我有两个视图模型:集合和文​​件夹。他们来了:

文件夹:

var folderViewModel = function (data) {
    var self = this;
    ko.mapping.fromJS(data, {}, self);

    self.isHovering = ko.observable(false);
    self.showCheckbox = function () {
        self.isHovering(true);
    };
    self.hideCheckbox = function () {
        self.isHovering(false);
    };
    self.checkboxIsVisible = ko.computed(function () {
        return selectedItemsCount() > 0 || self.isHovering();
    }, self);
    self.softCheckboxIsVisible = ko.computed(function () {
        return selectedItemsCount() > 0 && self.isHovering() == false;
    }, self);
    self.canDrag = ko.computed(function () {
        if (selectedItemsCount() == 0 && !isAddingNewContent()) {
            return true;
        } else {
            return false;
        }
    }, self);
    self.isSelected = ko.observable(false);
    self.toggleSelected = function () {
        self.isSelected(!self.isSelected());
    };
    self.textSelected = ko.observable(false);
    self.toggleTextSelected = function () {
        self.textSelected(!self.textSelected());
    };
    self.isSet = ko.observable(false);
    self.isDeleting = ko.observable(false);
    self.isNew = ko.observable(false);
    // If the folder hasn't been created yet, it won't have a folderId
    if (typeof self.folderId === 'undefined') {
        self.isNew(true);
    }
    self.isEditing = ko.observable(false).publishOn("IS_EDITING_CONTENT");
    // monitor for clicks 
    // temp title
    self.oldTitle = ko.observable();
};

放:

var setViewModel = function (data) {
    var self = this;

    // Checkbox controls
    self.isHovering = ko.observable(false);
    self.showCheckbox = function () {
        self.isHovering(true);
    };
    self.hideCheckbox = function () {
        self.isHovering(false);
    };
    self.checkboxIsVisible = ko.computed(function () {
        return selectedItemsCount() > 0 || this.isHovering();
    }, self);
    self.softCheckboxIsVisible = ko.computed(function () {
        return selectedItemsCount() > 0 && this.isHovering() == false;
    }, self);

    self.canDrag = ko.computed(function () {
        if (selectedItemsCount() == 0 && !isAddingNewContent()) {
            return true;
        } else {
            return false;
        }
    }, self);
    self.isSelected = ko.observable(false);
    self.toggleSelected = function () {
        self.isSelected(!self.isSelected());
    };
    self.textSelected = ko.observable(false);
    self.toggleTextSelected = function () {
        self.textSelected(!self.textSelected());
    };
    self.isSet = ko.observable(true);

    ko.mapping.fromJS(data, {}, self);
    self.isDeleting = ko.observable(false);
    self.isNew = ko.observable(false);
    // If the folder hasn't been created yet, it won't have a folderId
    if (typeof self.setId === 'undefined') {
        self.isNew(true);
    }
    self.isEditing = ko.observable(false).publishOn("IS_EDITING_CONTENT");
    // temp title
    self.oldTitle = ko.observable();

};

许多这些属性在视图模型之间重复。我应该让它们保持原样,还是有一种很好的方法来压缩这段代码?

4

2 回答 2

1

创建一个辅助方法,两个视图模型构造函数都调用它来添加所有公共属性...

var helper = function (self, data) {
    self.isHovering = ko.observable(false);
    // ...
    return self;
};
var setViewModel = function (data) {
    var self = helper(this, data);
    // extra stuff
};
var folderViewModel = function (data) {
    var self = helper(this, data);
    // extra stuff
};
于 2013-05-29T22:38:44.203 回答
1

尝试继承怎么样?您可以使用(集合和文件夹)都具有的属性和功能编写原型视图模型,然后为具有与视图模型相同原型的 setViewModel 和 folderViewModel 定义新的“类”,只需添加只有它们具有的属性和功能。

javascript中的继承简介可以在这里找到...

于 2013-05-29T22:09:12.620 回答