zoukankan      html  css  js  c++  java
  • 观察者模式使用WebForm实现的例子

    观察者模式是一种可以描述一对多对象依赖关系的行为模式。当一个对象状态发生变化时,依赖它的其它对象会自动被更新状态。下面这个图展示了观察者模式的层级:


    举个例子吧,我们某个报表界面现在有个dashboard的数据发生变化,需要在它更新的时候去更新此页面上其它几个报表的数据那么可以使用观察者模式来实现。观察者模式有个很好的特点是能够对观察者的add/remve有很大的灵活性。
    如果你对观察者模式还是不很了解,建议你看看这里这篇文章:
    http://blog.csdn.net/dujingjing1230/archive/2009/08/10/4430778.aspx
    http://blog.csdn.net/dujingjing1230/archive/2009/08/12/4438348.aspx
    我假设你是个framework1.1的使用者,对2.0的Generics还不清楚,那么你必须先去了解了解Generics这个类库的基本使用。推荐你看看这个视频:
    http://www.microsoft.com/uk/msdn/nuggets/nugget/128/Generics-in-NET-Framework-20.aspx
    英文还可以的话建议你看看这本书:


    我很喜欢这本书。差不多50$。。
    如果你和我一样比较穷(上面的书是公司买的我庆幸。。。)最基本的是看这几篇文章吧:
    http://www.codeproject.com/KB/cs/generics_explained.aspx
    http://msdn.microsoft.com/zh-cn/library/system.collections.generic.aspx

    Anyway, 你应该去学学它。
    言归正传.现在举个例子,就是上面说的一个dashboard得数据发生变化时下面的报表需要跟着更新。这是说明观察者模式特经典的一个例子。
    1. 创建一个asp.net的web应用程序。
    2. 创建一个主题类(DashboardPage)然后添加它需要的属性和方法。
    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;


    /// <summary>
    /// Summary description for DashboardPage
    /// </summary>
    public class DashboardPage : System.Web.UI.Page {
    private List<IReport> _ReportCollection = new List<IReport>();

    public string SelectedProduct { get; set; }
    public DateTime SelectedDate { get; set; }

    public DashboardPage() {
    }

    public void Add(IReport module) {
    _ReportCollection.Add(module);
    }

    public void Remove(IReport module) {
    _ReportCollection.Remove(module);
    }

    public void Update() {
    foreach (IReport m in _ReportCollection) {
    m.Update(this);
    }
    }
    这个主题类将会作为参数传递给每个报表。
    3. 创建一个观察者接口来添加Update方法的定义。所有的观察者类都需要继承这个接口。
    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;

    /// <summary>
    /// Summary description for IReport
    /// </summary>
    public interface IReport
    {
    void Update(DashboardPage page);
    }
    使用这个接口而不是直接在每个观察者的类中把DashboardPage作为它们的参数是为了让我们的实现更加灵活。
    4. 添加一个SalesDashboard.aspx页面让它的后台代码继承DashboardPage类。然后为它添加一个dropdownlist和一个calendar。
    5. 创建两个webUserControls作为两个报表,一定记住需要继承接口IReport。Update方法的实例化:
    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;

    public partial class SalesReport2 : System.Web.UI.UserControl, IReport
    {
    protected void Page_Load(object sender, EventArgs e)
    {

    }

    #region IReport Members

    public void Update(DashboardPage page) {
    this.Label1.Text = page.SelectedProduct;
    this.Label2.Text = page.SelectedDate.ToLongDateString();
    }

    #endregion
    }

    前台:
    <%@ Control Language="C#" AutoEventWireup="true" CodeFile="SalesReport2.ascx.cs" Inherits="SalesReport2" %>
    <h2>Sales Report 2</h2>
    Sales data for the product: <asp:Label ID="Label1" runat="server" Text=""></asp:Label>
    <br />
    Updated Date: <asp:Label ID="Label2" runat="server" Text=""></asp:Label>
    6. 最后一步就是在Salesdasnboard.aspx页面加载时需要添加吧两个报表都添加到List<IReport>中。以便在Update的时候这两个Report都能执行Update(DashboardPage)方法。
    protected override void OnLoad(EventArgs e) {
    SelectedProduct = this.DropDownList1.SelectedValue;
    SelectedDate = this.Calendar1.SelectedDate;

    Add(SalesReport11);
    Add(SalesReport21);

    base.OnLoad(e);
    }
    7. 运行结果:


    附上代码:
    http://download.csdn.net/source/1652674

  • 相关阅读:
    【React Native】某个页面禁用物理返回键
    【React Native】DeviceEventEmitter监听通知及带参数传值
    转载【React Native代码】手写验证码倒计时组件
    【React Native】 中设置 APP 名称、应用图标、为安卓添加启动图
    【React Native错误集】* What went wrong: Execution failed for task ':app:installDebug'.
    【React Native错误集】Import fails with "Failed to execute 'ImportScripts' on 'WorkerGlobalScope'"
    【React Native错误集】Android error “Could not get BatchedBridge, make sure your bundle is packaged properly” on start of app
    「React Native笔记」在React的 setState 中操作数组和对象的多种方法(合集)
    【React Native】Error: Attribute application@allowBackup value=(false) from AndroidManifest.xml
    坚果云如何使用二次验证码/谷歌身份验证器/两步验证/虚拟MFA?
  • 原文地址:https://www.cnblogs.com/blogpro/p/11462920.html
Copyright © 2011-2022 走看看