Ext.Net學習筆記03:Ext.Net MessageBus用法


MessageBus的在Ext.Net 2中新增的功能。我在上一篇中已經提到過,這篇內容將主要介紹MessageBus的用法。

發布和訂閱消息

Ext.Net MessageBus 的本質是一個消息訂閱機制,ExtJS中沒有這種機制,所以MessageBus的Ext.Net實現的,但並不是原創,這種功能在dojo中早就實現了,可以參見我的博客:Dojo入門:dojo中的事件處理

下面的代碼將演示如何使用 MessageBus 發布和訂閱消息:

<ext:Button runat="server" ID="btn2" Text="發布消息" Handler="fnButtonHandler"></ext:Button>

首先定義了一個按鈕,這個按鈕單擊的時候將會執行fnButtonHandler方法,我們在這個方法中發布消息:

function fnButtonHandler() {
    Ext.net.Bus.publish(

"Custom.Event1", { item: this

});
}

Ext.net.Bus.publish方法的第一個參數是消息名稱,第二個參數是消息的參數。

接下來我們來訂閱這個消息:

Ext.onReady(function () {
 Ext.net.Bus.subscribe(

"Custom.*", function

() { console.log(arguments); });
});

在onReady事件中,添加對消息Custom.*的訂閱,這里使用了通配符,表示訂閱Custom.開頭的所有消息。

代碼完成以后,我們來刷新頁面,然后點擊按鈕,這個時候控制台顯示如下:

image

這是我們通過代碼來實現的消息發布和訂閱,除此之外,Ext.Net還允許通過控件來發布和訂閱消息。

通過控件發布和訂閱消息

我這里通過一個現成的例子來演示:

<ext:Panel ID="Panel1"
    runat="server"
    Title="MessageBus Event Logger"
    Width="400"
    Height="300"
    AutoScroll="true">
    <MessageBusListeners>
        <ext:MessageBusListener
            Name="App.*"
            Handler="this.body.createChild({
            html: 'Received event from ' + data.item.id,
            tag: 'p'
            });" />
    </MessageBusListeners>
    <Buttons>
        <ext:Button ID="Button1" runat="server" Text="Publish event 1">
            <Listeners>
                <Click BroadcastOnBus="App.event1" />
            </Listeners>
        </ext:Button>
    </Buttons>
</ext:Panel>

在這段代碼中,我們通過按鈕的click事件來發布消息,控件panel則訂閱了這個消息,效果如下:

image

服務器端的消息發布和訂閱處理

上面的演示都是在客戶端完成的,接下來這個就厲害了,在服務器端的消息發布和訂閱,請看代碼:

<ext:Button runat="server" ID="btnPublish" Text="消息發布者"
    OnDirectClick="btnPublish_DirectClick">
</ext:Button>
<ext:Button runat="server" ID="btnSubscribe" Text="消息訂閱者">
    <MessageBusDirectEvents>
        <ext:MessageBusDirectEvent
            Name="App.*"
            OnEvent="subscribe_Event">
        </ext:MessageBusDirectEvent>
    </MessageBusDirectEvents>
</ext:Button>

首先是兩個按鈕,一個用來發布消息,一個來訂閱消息。

在消息發布者按鈕中, 我們使用了OnDirectClick事件,這是一個服務器端處理的事件,是Direct Click事件的簡寫。

在訂閱者按鈕中,我們添加了訂閱的相關配置,並通過事件處理方法subscribe_Event來處理訂閱到的消息,服務器端的相應代碼如下:

protected void btnPublish_DirectClick(object sender, Ext.Net.DirectEventArgs e)
{
    Ext.Net.

MessageBus.Default.Publish("App.Server"

);
}

protected void subscribe_Event(object sender, Ext.Net.DirectEventArgs e)
{
    X.MessageBox.Alert("提示", "接收到來自服務器的消息,消息名稱:" + e.Name).Show();
}

重新編譯代碼,然后刷新我們的頁面。當點擊消息發布按鈕時,我們會接收到服務器端的消息:

image

有心的朋友想想這段代碼的執行過程吧。

1.觸發服務器端的按鈕點擊,在按鈕點擊事件中發布消息,並將消息在客戶端發布

2.客戶端訂閱者按鈕接收到消息的發布

3.訂閱者按鈕將消息發送到服務器端進行處理

總結

Ext.Net MessageBus可以方便的完成消息發布和訂閱機制,並能夠在前台和后台代碼中結合使用。

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM