为什么要添加属性/方法到视图模型AFTER定义

Why add properties/methods to viewmodel AFTER definition?

本文关键字:视图 模型 AFTER 定义 方法 添加 属性 为什么      更新时间:2023-09-26

我使用一个示例项目(durandal541)作为参考,在添加身份验证到我的durandal541为基础的应用程序。在它中,我注意到在大多数页面的视图模型中,程序员已经这样做了:

        // Reveal the bindable properties and functions
        var vm = {
            activate: activate,
            goBack: goBack,
            title: 'manage',
            session: session,
            userName: ko.observable(),
            logins: ko.observableArray(),
            localLoginProvider: ko.observable(),
            externalLoginProviders: ko.observableArray(),
            message: ko.observable()
        };
        vm.hasLocalPassword = ko.computed(function () {
            var logins = vm.logins();
            for (var i = 0; i < logins.length; i++) {
                if (logins[i].loginProvider() === vm.localLoginProvider()) {
                    return true;
                }
            }
            return false;
        });
        vm.changePassword = ko.computed(function () {
            if (!vm.hasLocalPassword()) {
                return null;
            }
            return new ChangePasswordViewModel(vm, vm.userName());
        });
        ...

添加"hasLocalPassword"answers"changePassword"到刚刚定义的"vm"视图模型而不是这样做,它们在定义时作为视图模型的一部分包含在其中的点/好处是什么?:

        // Reveal the bindable properties and functions
        var vm = {
            activate: activate,
            goBack: goBack,
            title: 'manage',
            session: session,
            userName: ko.observable(),
            logins: ko.observableArray(),
            localLoginProvider: ko.observable(),
            externalLoginProviders: ko.observableArray(),
            message: ko.observable(),
            hasLocalPassword = ko.computed(function () {
                var logins = vm.logins();
                for (var i = 0; i < logins.length; i++) {
                    if (logins[i].loginProvider() === vm.localLoginProvider()) {
                        return true;
                    }
                }
                return false;
            }),
            changePassword = ko.computed(function () {
                if (!vm.hasLocalPassword()) {
                    return null;
                }
                return new ChangePasswordViewModel(vm, vm.userName());
            })
        };

啊。现在我明白了。正如Ryan Niemayer在10:45解释的那样!http://vimeo.com/51103092

这个问题可能会被删除,但以防任何其他新手想知道-简单的答案是ko.computeds立即被评估(当然,除非您添加了deferred选项),这意味着在这种情况下,任何引用"vm"视图模型的computed在启动时失败,如果在视图模型本身中定义(如我的第二个例子),因为vm在那一刻根本不存在!因此,在初始定义之后,将计算添加到已定义的视图模型对象中,如第一个示例所示。