MVVM模式的3种command总结--DelegateCommand

查了不少资料,大概理清楚的就是有3种。当然类名可以自己取了,不过为了便于记忆和区分,还是和看到的文章里面用一样的类名。

1.DelegateCommand

2.RelayCommand

3.AttachbehaviorCommand

因为MVVM模式适合于WPF和SL,所以这3种模式中也有一些小差异,比如RelayCommand下面的CommandManager方法就是WPF下面的,SL下面无法使用,不过我认为这3种方法中的基本思路都如出一辙,都是出自那位外国牛人的文章里面。主要的区别在于和VIEW中的控件的绑定使用上。有点不同的attachbehaviorcommand是prism4里面的一种设计模式,这个区别有点大。但我自己觉得最方便的还是这个DelegateCommand。

        /// <summary>
      /// Delegatecommand,这种WPF.SL都可以用,VIEW里面直接使用INTERACTION的trigger激发。比较靠谱,适合不同的UIElement控件
      /// </summary>
     public class DelegateCommand : ICommand
      {
          Func<object, bool> canExecute;
          Action<object> executeAction;
          bool canExecuteCache;
  
         public DelegateCommand(Action<object> executeAction, Func<object, bool> canExecute)
         {
             this.executeAction = executeAction;
             this.canExecute = canExecute;
         }
 
         public bool CanExecute(object parameter)
         {
             bool temp = canExecute(parameter);
 
             if (canExecuteCache != temp)
             {
                 canExecuteCache = temp;
                 if (CanExecuteChanged != null)
                 {
                     CanExecuteChanged(this, new EventArgs());
                 }
             }

             return canExecuteCache;
         }

         public event EventHandler CanExecuteChanged;

         public void Execute(object parameter)
         {
                 executeAction(parameter);
         }

这个类大概可以这样来理解,构造函数中的action和func,action负责判断是否执行这个command,action就是触发这个command之后要执行的方法。这样理解最浅显,但对刚熟悉command的我来讲,这样最方便记忆和学习,为了使用ICommand接口实现的方法和事件的解释搜搜就可以找到,但是刚开始理解起来还是有点晦涩。

下面是VM里面用这个command的例子。绑定了一个button控件,最简单例子。cm1Click就是构造函数里面的fuc,负责执行响应事件的方法。Cancm1Click就是构造函数里面的action,负责判断这个Command的响应事件是否执行,这里没有用到判断式,直接赋了一个true.

public class TestViewModels:INotifyPropertyChanged
{
        public TestViewModels()
        {
            ......
            cm1click = new DelegateCommand(cm1Click,Cancm1Click);   //初始化delegatecommand

        }
       ....

       //DelegateCommand

        #region command1

        public ICommand cm1click { get; set; }
        public void cm1Click(object param)
        {
            MessageBox.Show("CM1 clicked!");
        }

        private bool Cancm1Click(object param)
        {
            return true;
        }

        #endregion command1
       ......
}

在XAML里面,用interaction来绑定这个事件,而不是在button里面用command来绑定,这样做有个好处,就是非常直观,并且可以响应其他的很多事件

        <Button x:Name="BTN_CM1" Content="DelegateCommand" Height="115" Width="148" >
            <i:Interaction.Triggers>
                <i:EventTrigger EventName="Click">
                    <i:InvokeCommandAction Command="{Binding cm1click}"/>
                </i:EventTrigger>
            </i:Interaction.Triggers>
        </Button>

如果是其他控件如grid等,要响应selectionchanged事件之类的,就可以直接在trigger里面把EventName修改下就可以了。在blend里面更方便,可以直接选择。但是有个问题一直没搞明白.这样的话,怎么获取事件的参数,我这里有个例子,再看看了再更新下。

文章来源:MVVM模式的3种command总结[1]--DelegateCommand - 保安保安 - 博客园

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
MVVM 是一前端架构设计模式,它将界面、数据和逻辑分离并通过 ViewModel 进行交互。在 MVVM 模式中,视图(View)和模型(Model)是完全独立的,它们通过 ViewModel 进行双向绑定(Binding)。 在 Vue.js 中,MVVM 模式被称为“响应式编程”,它的核心是数据劫持和发布订阅模式。Vue.js 的数据驱动视图,通过数据改变来更新视图,这些数据是被劫持的,也就是说,当数据发生变化时,Vue.js 会自动更新视图。 Vue.js 中的 MVVM 模式包含以下三个部分: 1. 视图层(View):负责展示数据,通常是 HTML 模板。 2. 模型层(Model):负责存储数据,通常是 JavaScript 对象。 3. 视图模型层(ViewModel):负责处理视图与模型之间的交互,它是一个纯粹的 JavaScript 对象,负责实现数据绑定、数据格式化、事件监听等功能。 在 Vue.js 中,我们可以使用指令(v-directive)来实现数据绑定。指令是一特殊的 HTML 属性,它的值通常是一个表达式,用来绑定指令所在元素的属性或事件。例如,v-bind 指令可以将一个 JavaScript 对象绑定到 DOM 元素的属性,v-on 指令可以监听 DOM 元素的事件。 除了指令之外,Vue.js 还提供了计算属性(Computed)和侦听器(Watch)等功能,用于处理数据的计算和监听数据的变化。 总之,MVVM 模式是一前端架构设计模式,它通过 ViewModel 实现视图(View)和模型(Model)之间的双向绑定(Binding),实现了数据的自动更新和视图的响应式。在 Vue.js 中,MVVM 模式被称为“响应式编程”,它的核心是数据劫持和发布订阅模式

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值