MVVM模式的UI界面数据返回问题

MVVM模式里面用户UI界面的数据返回问题,让我纠结了好几天,一直得不到数据,今天总算能取到UI界面的数据了!

我采用的是ListView显示数据和Prism模式,并且将数据显示成了大图标的样式,即水平显示,但是下面测试用的我就没有采用水平显示,做了简单Model。

XAML 代码:

<ListView ItemsSource="{Binding ProductList}" x:Name="lv" Margin="8,8,8,37.96" SelectedItem="{Binding CurrentSelected, Mode=TwoWay}" >
  <ListView.View>
    <GridView x:Name="datagrid">
       <GridViewColumn Header="Name" DisplayMemberBinding="{Binding Name}"/>
       <GridViewColumn Header="Price" DisplayMemberBinding="{Binding Price}"/>
  </GridView>
</ListView.View>

   <!-定义了触发命令->

      <i:Interaction.Triggers>
         <i:EventTrigger EventName="SelectionChanged"> <!-调用xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"->
             <i:InvokeCommandAction Command="{Binding SelectMenuCommand}" CommandParameter="{Binding CurrentSelected,ElementName=lv}"/>
        </i:EventTrigger>

       </i:Interaction.Triggers>

</ListView>
<Label Content="{Binding CurrentSelected.Price}" HorizontalAlignment="Left" Margin="34,289,0,0" VerticalAlignment="Top" Width="312"/>

  

这里绑定的数据必须是同数据类型才能在,SelectedItem里面返回到后台的VM里面,用户数据返回的时候必须是TwoWay,不然,无法在后台得到值。

VM 代码:

 public DelegateCommand SelectMenuCommand { get; set; }

        ObservableCollection<TestModel> m_lstProducts = new ObservableCollection<TestModel>();

         public MainWindowVM()
    {
        m_lstProducts.Add(new TestModel() { Name = "Car", Price = 1 });
        m_lstProducts.Add(new TestModel() { Name = "Pencil", Price = 2 });
        m_lstProducts.Add(new TestModel() { Name = "Computer", Price = 3 });
        m_lstProducts.Add(new TestModel() { Name = "Table", Price = 4 });
        m_lstProducts.Add(new TestModel() { Name = "Chair", Price = 5 });

    }

         public ObservableCollection<TestModel> ProductList
    {
        get { return m_lstProducts; }
    }

         private TestModel currentselected;

         public TestModel CurrentSelected
         {
             get { return currentselected; }
             set
             {
                 if (currentselected != value)
                 {
                     currentselected = value;
                     this.RaisePropertyChanged("CurrentSelected");
                 }
             }
         }

    }

这里 简化了 MODEL数据,数据模型里面 只有名字和价格。

这里 要注意的就是 绑定在SelectedItem上面的类型必须是M,我就是搞了几天,搞的稀里糊涂的,今天总算把这个理清了,写出来给自己做个记录。

时间: 12-18

MVVM模式的UI界面数据返回问题的相关文章

网络数据的下载(NSUrlconnection异步下载和NSstring同步下载)和UI界面数据的刷新(都是抛弃第三方库的一些本质)

<1>NSString同步下载        //字符串的类方法,会根据url向服务器发起同步的数据请求,并将请求结果作为返回值    //同步请求数据,会对程序的UI主线程造成阻塞,用户体验极差 NSString *str = [NSString stringWithContentsOfURL:[NSURL URLWithString:kUrl] encoding:NSUTF8StringEncoding error:nil];    //json格式的数据 进行json解析 数据最外层是

实战基础技能(08)--------MVVM模式中WPF数据的完全绑定

一:截图,描述:将后台代码的姓名.年龄绑定到文本框,单击”增加年龄“--年龄自+1,单击”显示年龄“--弹出年龄的显示对话框,实现了从文本框修改年龄和后台更改年龄并显示到文本框 运行结果和解决方案管理截图如下: 二:person类 using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.ComponentModel; namespace 完全数据绑定 {

Android基础之——startActivityForResult启动界面并返回数据,上传头像

在android应用的开发过程中,经常会出现启动一个界面后填写部分内容后带着数据返回启动前的界面,最典型的应用就是登录过程.在很多应用程序的模块中,都有"我的"这个模块,在未登录状态下点击其中的某一项,就会弹出登录界面,登录完成后回到我的界面,会显示一些登录后的数据,这个功能的实现就要用到startActivityForResult. 下面通过一个小demo来说明一下startActivityForResult的使用,以及在实际开发中的一些应用. demo的效果图如下: 主界面布局:

jquery ui autocomplete ajax返回数据自定义显示

1.body里面的内容 <input type="text" class="inputTxt" id="txtJigou" autocomplete="off"/> 2.引入jquery.ui.min.js和他的样式 3.js代码如下<script type="text/javascript"> $(function(){ $("#txtJigou").autoc

浅析WPF中MVVM模式下命令与委托的关系

??各位朋友大家好,我是Payne,欢迎大家关注我的博客,我的博客地址是http://qinyuanpei.com.最近因为项目上的原因开始接触WPF,或许这样一个在现在来讲显得过时的东西,我猜大家不会有兴趣去了解,可是你不会明白对某些保守的项目来讲,安全性比先进性更为重要,所以当你发现银行这类机构还在使用各种"复古"的软件系统的时候,你应该相信这类东西的确有它们存在的意义.与此同时,你会更加深刻地明白一个道理:技术是否先进性和其流行程度本身并无直接联系.由此我们可以推论出:一项不流行

通用Windows应用《博客园-开发者的网上家园》开发(1)——MVVM模式

最近开发了个WP8.1和Windows8.1平台上的应用——<博客园-开发者的网上家园>,基于 Windows Runtime .在此有必要说明一下,WP8.0以前的应用程序是基于Silverlight的,微软为了统一Windows Phone OS 和 Windows RT,从开发人员的角度上,也统一了两个平台上大部分的API,使得开发人员可以共享代码(而不是一次编写,跨平台运行). 本文着重描述MVVM在Windows Runtime应用程序下的表现,关于MVVM模式的理解,可参考园子里 

uwp开发:MVVM模式和数据绑定结合使用实战示例

——我的<简影uwp>开发了一段时间了,现在各个板块和基本功能已经完工,剩下的就是细节方面的处理和UI排版设计了.开发期间遇到过很多问题,由于是个人独立开发.所以好多问题需要自己想好长时间,或者去网上寻找大神求助,有时候晚上做梦都是满脑子的代码.好的是大部分最终都解决了!真的非常感谢那些帮助我的大神们,和他们交流,我学到了很多... 好了,闲话不多说,前几天,我处理的是集合数据绑定的问题,也就是说返回的是一个集合数据,用MVVM模式来说,让ViewModel层实现ObservableColle

Prism4 文档翻译系列---第5章 实现MVVM模式

MVVM模式有助于清楚的区分应用程序界面的业务层和展现层.保持一个清晰的应用程序逻辑和UI分离有助于处理开发和设计过程中大量的问题,同时,使得应用程序的测试,维护,和扩展更加容易.MVVM也可以极大的提升代码的可重用性也可以使开发人员和设计人员在分别开发应用程序的某一部分时更方便的沟通交流. 运用MVVM模式,应用程序的UI和下层表现以及业务逻辑被拆分到三个单独到类中:视图,封装了UI和UI逻辑:视图模型,封装了展现逻辑和状态:模型,封装了应用程序的业务逻辑和数据. Prism包含了如何在Sil

angular中的MVVM模式

在开始介绍angular原理之前,我们有必要先了解下mvvm模式在angular中运用.虽然在angular社区一直将angular统称为前端MVC框架,同时angular团队也称它为MVW(Whatever)框架,但angular框架整体上更接近MVVM模式.下面是Igor Minar发布在Google+ https://plus.google.com/+IgorMinar/posts/DRUAkZmXjNV的文章内容: MVC vs MVVM vs MVP. What a controver