仅在WPF MVVM中的两个视图之间进行通信

时间:2011-07-25 06:18:20

标签: wpf mvvm

我在MVVM(WPF)中有两个视图。第一个视图包含两个文本框:用户名,密码,第二个视图有两个按钮:提交和清除。两个视图现在都设置在On Form上。当我按下“清除”按钮时,两个文本框都被清除,并在提交中显示UserName和Password的消息。我只使用MVVM + WPF,而不是棱镜。

第一视图的ModelView:

class LoginView:ViewModelBase
    {
        string _userName;
        public string  UserName 
        {
            get {return _userName ; }
            set {
                if (_userName != value)
                {
                    _userName = value;
                }
                base.OnPropertyChanged(UserName);
            }
        }

        string _Pwd;
        public string PWD
        {
            get { return _Pwd; }
            set
            {

                _Pwd = value;
                base.OnPropertyChanged(_Pwd);
            }
        }
    }

和For Button

 class ButtonHandler
    {
        private DelegateCommand _ClearData;
        public ICommand ClearCommand
        {
            get
            {
                if (_ClearData == null)
                {
                    _ClearData = new DelegateCommand(ClearText);
                }
                return _ClearData;
            }
        }
        LoginView lg = new LoginView();
        private void ClearText()
        {
            lg.UserName = "";
            lg.PWD = "";
        }
    }

并查看第一个控件的代码

   <Label Content="Login" Grid.Row="0" Grid.Column="1" VerticalAlignment="Top" HorizontalAlignment="Left"
           FontFamily="Georgia" FontSize="24" FontWeight="UltraBold" ></Label>
    <Label Content="User Name" Grid.Row="1" Grid.Column="1" VerticalAlignment="Center" HorizontalAlignment="Left"></Label>
    <Label Content="Password" Grid.Row="2" Grid.Column="1" VerticalAlignment="Center" HorizontalAlignment="Left"></Label>
    <TextBox  Name="username" Grid.Row="1" Grid.Column="1" Margin="100,0,0,0" VerticalAlignment="Center" HorizontalAlignment="Left" Text="{Binding Path=UserName,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" ></TextBox>
    <TextBox  Name="pwd" Grid.Row="2" Grid.Column="1" Margin="100,0,0,0" VerticalAlignment="Center" HorizontalAlignment="Left" Text="{Binding Path=PWD,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"></TextBox>
    <Separator Grid.Row="0" Grid.Column="1" Height="5" Margin="0,40,0,0" Background="Green"></Separator>

和按钮视图

     <Button x:Name="Submit" Content="Submit" Grid.Column="1"></Button>
     <Button x:Name="Clear" Content="Clear" Grid.Column="2" 
             Command="{Binding Path=ClearCommand, Mode=OneWay, 
             UpdateSourceTrigger=PropertyChanged}" >
     </Button>

为什么它不起作用?

2 个答案:

答案 0 :(得分:2)

您没有正确使用MVVM模式,使用此模式,ViewModel不应该具有对View的引用。命令是ViewModel的一部分,因此您对LoginView的引用违反了模式。

所以你有两个输入字段和一个按钮?为此,我将有一个ViewModel和一个View。 ViewModel将公开两个字符串属性(用户名和密码)和一个绑定到clear按钮的命令。当命令执行时,它将清除ViewModel上的用户名和密码文本。然后,视图将相应更新。

答案 1 :(得分:1)

MVVM的基本原则是拥有一个视图可以绑定到的类,其中包含所有应用程序逻辑。其中一个主要原因是a separation of concerns.因此,如果您想要一个用户名,您将公开一个视图绑定的属性,然后当您想要登录时创建一个使用这些绑定值提交给您的业务的函数你的应用程序的逻辑层。

这似乎是在您的示例中使用MVVM的一种方式:

public class LoginViewModel
{
  public string UserName {get;set;}//Implement INotifyPropertyChanged
  public string PWD {get;set;}

    private DelegateCommand _ClearData;
    public ICommand ClearCommand
    {
        get
        {
            if (_ClearData == null)
            {
                _ClearData = new DelegateCommand(ClearText);
            }
            return _ClearData;
        }
    }

    private void ClearText()
    {
        UserName = "";
        PWD = "";
    }
}

然后在你的xaml中:

<TextBox Text={Binding UserName} />
<TextBox Text={Binding PWD} />
<Button Command={Binding ClearCommand}/>