WPF 元件間通訊 MVVM 進行解耦

2022-02-21 04:49:41 字數 2028 閱讀 7054

假設有這樣乙個需求,有這樣乙個聊天介面,主介面是選項卡,其一選項卡內部是真正的聊天列表和聊天介面,我們需要實時的在主介面顯示未讀訊息的數量

假設我們已經有方法可以拿到未讀訊息的數量,那麼如何在主介面的選項卡上面進行顯示呢,如釘釘

第一,我們可以很暴力的直接在子控制項的viewmodel或者後台**中拿到主介面中繫結的乙個屬性值,直接進行修改。這種方法很簡單,很方便,但是在程式內部無疑增加了耦合度

第二,我們則自己嘗試製作這樣乙個訊息通訊中心。

思考幾分鐘,首先,觀察者模式充斥著我們的桌面開發中,利用發布/訂閱這種模式,顯示最合理也最簡單,在面向事件開發中,訂閱事件,將我們的動作繫結到事件上,觸發事件同時呼叫我們的動作,則整個過程也順利完成。

1.完成帶有訊息儲存和發布/訂閱的事件處理中心

我們使用鍵值對將我們的訊息和事件進行繫結,並且完成發布/訂閱兩個方法,這裡的方法會對所有訂閱者進行發布,如果需要分組,過濾,多次執行等操作,可以重寫該類及發布訂閱方法。

public

class

messager

private

static

messager _message;

public

static messager default => _message??(_message=new

messager());

//////

訂閱

/// ///

//////

public

virtual

void register(string topic,actiont)

var invoker=new

messagerinvokehandler();

invoker.messagerinvokeevent +=t;

messagers.add(topic, invoker);

}//////

發布

/// ///

//////

public

virtual

void send(string

topic, t element) );}

}

2.發布訊息時的事件處理類包含乙個事件用來繫結訂閱的操作,以及乙個方法執行事件

///

///訊息執行類

/// public

class

messagerinvokehandler

}

3.訊息呼叫時的上下文引數這邊大家可以根據自己的需求自行增加修改

public

class

messagercontext

//////

主題

/// public

string topic

}

如何使用?訂閱

//

註冊修改單個訊息的通知

messager.default.register(messagertopic.modifysinglecount, modifysinglecount);

private

void

modifysinglecount(messagercontext context)

發布

messager.default.send(messagertopic.modifysinglecount,10);
我已經在專案中使用該方法了,但是又缺陷就是設計問題,導致上下文沒有使用泛型,data只能用object型別接收,有任何問題歡迎指正!

Vue 元件間進行通訊

父元件與子元件通訊段橋梁是子組建的props屬性,通過屬性繫結的方式,將父元件的資料傳到子元件的props中,子元件在內部使用這些資料。可能你已經注意到,通過props是可以修改父元件的資料,但是vue並不推薦這種方式進行子元件向父元件通訊的資料互動,可能會造成資料的混亂。props是乙個單項資料流...

vue元件間通訊

1 父元件向子元件傳遞資料,只需要props就行。設定資料並繫結到元件上。子元件用props接收,就能在元件內部使用獲取到的資料 反向通訊則需要在父級元件上自定義對應的方法,子元件使用 emit呼叫父元件方法,並上傳資料 content date content.vue date.vue 上面這個例...

vue元件間通訊

參考文章 vue父子元件間通訊可以用prop完成,跨級通訊則要用attrs來實現。1.attrs實現跨級通訊 父親元件 father元件 p msg1 p msg1 msg1 msg2 msg2 msg3 msg3 msg4 msg4 title 乙個標題 son1 div template imp...