假设有这样一个需求,有这样一个聊天界面,主界面是选项卡,其一选项卡内部是真正的聊天列表和聊天界面,我们需要实时的在主界面显示未读消息的数量

假设我们已经有方法可以拿到未读消息的数量,那么如何在主界面的选项卡上面进行显示呢,如钉钉

第一,我们可以很暴力的直接在子控件的viewmodel或者后台代码中拿到主界面中绑定的一个属性值,直接进行修改。这种方法很简单,很方便,但是在程序内部无疑增加了耦合度

刚毕业或工作一年的这样写我觉得可以,但是如果你是个有程序洁癖并且有了一定工作经验的程序员的话,你肯定很不爽。你可能会去百度看看别人是如何做的,其实你也很容易就能得到一些方案,比如MVVMLight自带的通信机制就是很好的选择,但是它很重,如果你的MVVM不是使用的它的话,那你为了这点功能而且选择使用它,其实很浪费,并且它的通信功能很强大,如果你的需求仅仅和文章开头差不多或者稍微复杂点则完全没必要。

第二,我们则自己尝试制作这样一个消息通信中心。

思考几分钟,首先,观察者模式充斥着我们的桌面开发中,利用发布/订阅这种模式,显示最合理也最简单,在面向事件开发中,订阅事件,将我们的动作绑定到事件上,触发事件同时调用我们的动作,则整个过程也顺利完成。

1.完成带有消息存储和发布/订阅的事件处理中心

我们使用键值对将我们的消息和事件进行绑定,并且完成发布/订阅两个方法,这里的方法会对所有订阅者进行发布,如果需要分组,过滤,多次执行等操作,可以重写该类及发布订阅方法。

public class Messager
{
/// <summary>
/// 消息集合
/// </summary>
private IDictionary<string, MessagerInvokeHandler> Messagers =
new Dictionary<string, MessagerInvokeHandler>(); private Messager() { } private static Messager _message; public static Messager Default => _message??(_message=new Messager()); /// <summary>
/// 订阅
/// </summary>
/// <typeparam name="T"></typeparam>
/// <param name="topic"></param>
/// <param name="t"></param>
public virtual void Register<T>(string topic,Action<MessagerContext> t)
{
if (t == null)
throw new ArgumentException();
if (Messagers.ContainsKey(topic))
{
var value=Messagers.FirstOrDefault(o => o.Key == topic).Value;
value.MessagerInvokeEvent += t;
return;
}
var invoker=new MessagerInvokeHandler();
invoker.MessagerInvokeEvent += t;
Messagers.Add(topic, invoker);
} /// <summary>
/// 发布
/// </summary>
/// <typeparam name="T"></typeparam>
/// <param name="topic"></param>
/// <param name="element"></param>
public virtual void Send<T>(string topic, T element)
{
if (!Messagers.ContainsKey(topic))
return;
var invoker = Messagers.FirstOrDefault(o => o.Key == topic).Value;
invoker.Invoke(new MessagerContext()
{
Data=element,
Topic=topic
});
}
}

2.发布消息时的事件处理类

包含一个事件用来绑定订阅的操作,以及一个方法执行事件

/// <summary>
/// 消息执行类
/// </summary>
public class MessagerInvokeHandler
{
public event Action<MessagerContext> MessagerInvokeEvent; public void Invoke(MessagerContext context)
{
MessagerInvokeEvent.Invoke(context);
}
}

3.消息调用时的上下文参数

这边大家可以根据自己的需求自行增加修改

public class MessagerContext
{
/// <summary>
/// 消息体
/// </summary>
public object Data { get; set; } /// <summary>
/// 主题
/// </summary>
public string Topic { get; set; }
}

如何使用?

订阅

//注册修改单个消息的通知
Messager.Default.Register<Int32>(MessagerTopic.ModifySingleCount, ModifySingleCount);        private void ModifySingleCount(MessagerContext context)
  {
  。。。。
  }

发布

Messager.Default.Send<Int32>(MessagerTopic.ModifySingleCount,10);

我已经在项目中使用该方法了,但是又缺陷就是设计问题,导致上下文没有使用泛型,data只能用object类型接收,有任何问题欢迎指正!

WPF 组件间通信 MVVM 进行解耦的更多相关文章

  1. 聊聊Vue.js组件间通信的几种姿势

    写在前面 因为对Vue.js很感兴趣,而且平时工作的技术栈也是Vue.js,这几个月花了些时间研究学习了一下Vue.js源码,并做了总结与输出. 文章的原地址:https://github.com/a ...

  2. React独立组件间通信联动

    React是现在主流的高效的前端框架,其官方文档 http://reactjs.cn/react/docs/getting-started.html 在介绍组件间通信时只给出了父子组件间通信的方法,而 ...

  3. 【Vue】利用父子组件间通信实现一个场景

    组件间通信是组件开发的,我们既希望组件的独立性,数据能互不干扰,又不可避免组件间会有联系和交互. 在vue中,父子组件的关系可以总结为props down,events up: 在vue2.0中废弃了 ...

  4. React 精要面试题讲解(二) 组件间通信详解

    单向数据流与组件间通信 上文我们已经讲述过,react 单向数据流的原理和简单模拟实现.结合上文中的代码,我们来进行这节面试题的讲解: react中的组件间通信. 那么,首先我们把看上文中的原生js代 ...

  5. vue_组件间通信:自定义事件、消息发布与订阅、槽

    自定义事件 只能用于 子组件 向 父组件 发送数据 可以取代函数类型的 props 在父组件: 给子组件@add-todo-event="addTodo" 在子组件: 相关方法中, ...

  6. Vue的父子组件间通信及借助$emit和$on解除父子级通信的耦合度高的问题

    1.父子级间通信,父类找子类非常容易,直接在子组件上加一个ref,父组件直接通过this.$refs操作子组件的数据和方法    父 这边子组件中 就完成了父 => 子组件通信 2. 子 =&g ...

  7. React 组件间通信介绍

    React 组件间通信方式简介 React 组件间通信主要分为以下四种情况: 父组件向子组件通信 子组件向父组件通信 跨级组件之间通信 非嵌套组件间通信 下面对这四种情况分别进行介绍:   父组件向子 ...

  8. Vue 根组件,局部,全局组件 | 组件间通信,案例组件化

    一 组件 <div id="app"> <h1>{{ msg }}</h1> </div> <script src=" ...

  9. [转] React 中组件间通信的几种方式

    在使用 React 的过程中,不可避免的需要组件间进行消息传递(通信),组件间通信大体有下面几种情况: 父组件向子组件通信 子组件向父组件通信 跨级组件之间通信 非嵌套组件间通信 下面依次说下这几种通 ...

  10. React的组件间通信

    一.React的单向数据流 React是单向数据流,数据主要从父节点传递到子节点(通过props).如果顶层(父级)的某个props改变了,React会重渲染所有的子节点.这通常被称为“自顶向下”或“ ...

随机推荐

  1. 2023 NOI春季测试游记

    前言: 知周所众,在 2023.3.4 ,圈钱因部分地区 NOIP 趋势了而组织举办了春测,这个蒟蒻本来没有 NOIP 的资格,但却去上了春测. 3.2 晚上jijidawang来发表,结果少无数份( ...

  2. 跨越千年医学对话:用AI技术解锁中医古籍知识,构建能够精准问答的智能语言模型,成就专业级古籍解读助手(LLAMA)

    跨越千年医学对话:用AI技术解锁中医古籍知识,构建能够精准问答的智能语言模型,成就专业级古籍解读助手(LLAMA) 介绍:首先在 Ziya-LLaMA-13B-V1基线模型的基础上加入中医教材.中医各 ...

  3. error C2039: "function": 不是 "std" 的成员的解决方法

    这个错误通过某度没找到合适的解决方案,故记录下来 其实如果使用 google 搜索错误的英文关键词,大概第一条就是解决问题的链接 Large number of "'function' is ...

  4. 美团面试:说说OOM三大场景和解决方案? (绝对史上最全)

    首先,咱们先聊聊,什么是OOM? 小伙伴们,有没有遇到过程序突然崩溃,然后抛出一个OutOfMemoryError的异常?这就是我们俗称的OOM,也就是内存溢出.简单来说,就是你的Java应用想要的内 ...

  5. AI开发之路

    常见报错解决 Dilb库安装的三种方法 yolov5项目cuda错误解决 环境准备 Anaconda-用conda创建python虚拟环境 Python-pip创建虚拟环境 jupyter noteb ...

  6. SSH不对称密钥自动登入服务器

    SSH不对称密钥自动登入服务器 1.先在自己的电脑上创建密钥对 ssh-keygen -t rsa Windows下生成SSH密钥 $ ssh-keygen -t rsa -C "youre ...

  7. 「实操」适配 NebulaGraph 新版本与压测实践

    本文来自邦盛科技-知识图谱团队-繁凡,本文以 NebulaGraph v3.1.0 为例. 前言 NebulaGraph v3.1 版本已经发布有一段时间了,但是我们的项目之前是基于 v2.6.1 版 ...

  8. STL-unordered_hashtable模拟实现

    #pragma once #include<vector> #include<string> #include<iostream> using std::cout; ...

  9. 如何提取html中的token?

    通过正则表达式提取(适用于提取文本结果): Re.seach()提取一个值,通过下标取值 Re.findall()提取多个值,通过下标取值 Resp= reques.get(url);print(re ...

  10. URL(网址)的组成

    URL(Uniform Resource Locator,统一资源定位器)就是通常所说的"网址".它是用来标识互联网上资源(如网页.图片.文件等)的唯一地址.URL由协议(如htt ...