使用基因剔除和MVVM时在何处编写dom操作代码

使用基因剔除和MVVM时在何处编写dom操作代码

本文介绍了使用基因剔除和MVVM时在何处编写dom操作代码的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

im开始引起我的注意,如果正确地在操纵dom或触发动画的viewmodel中编写代码,例如,我具有此绑定,该绑定将对要滑动的div的引用传递给我点击tr时退出

im starting to get my head around knockout and if its correct to write code in the viewmodel that manipulates the dom or fires animations etc. As an example i have this binding that passes in a reference to a div which i want to slide out when the tr is clicked

<tr data-bind="click: function(data, event){$parent.Select('#PanelWrapper', $data)}">

在我的视图模型中,我有

In my viewmodel i have

self.Select = function (panel, e) {
        console.log(ko.toJS(e));
        if(self.SelectedEmployee() === e)return;

        self.$PanelWrapper = $(panel);
        var $Bottom = parseInt(self.$PanelWrapper.css("bottom"));

        if($Bottom === 0){
            self.$PanelWrapper.animate({
                bottom:"-95"
            }, 500, function(){
                self.SelectedEmployee(e);
                self.Editable(new Employee(ko.toJS(e)));
            }).animate({
                bottom:"0"
            }, 500);
        }else{
            self.SelectedEmployee(e);
            self.Editable(new Employee(ko.toJS(e)));

            self.$PanelWrapper.animate({
                bottom:"0"
            }, 500);
        }
    };

我想知道这是否有效,是否遵循vmmv方法.任何帮助将不胜感激

Im wondering if this is valid and that it follows the vmmv methodology. Any help would be appreciated

推荐答案

不,在视图模型中操作dom不是一个好主意. MVVM的整个概念是将视图和UI的数据/行为部分分开.

No, it's not a good idea to manipulate the dom inside your viewmodel. The whole concept of MVVM is to separate the view and the data/behavior part of the UI.

您应该使用自定义绑定处理程序,或者您也可以创建这些效果/控件(我不知道在您的视图模型之外,这到底是什么). viewmodel应该只对视图建模:数据和该数据上的命令.

You should use custom binding handlers or you may also create these effects/controls (I don't know what exactly is this) outside your viewmodel. The viewmodel should only model the view: data and commands on that data.

这篇关于使用基因剔除和MVVM时在何处编写dom操作代码的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

08-20 09:31