2

我想创建可在整个应用程序中重用的可重用 mvc4 UI 组件/控件。互联网上有很多关于此的信息（主要是 mvc3），但似乎不完整或过于具体。

一般的应用程序架构将是从普通或 ajax 请求返回呈现的 html（我想澄清这个问题不是指 SinglePageApp 模型，所以组件在服务器上并且可能有客户端模型并且通信没有完成使用 json webapi)

问题是“如何最好地创建一个组件，使其行为如下所述？ ”

可重用组件应具有以下特性：

  • 它应该在同一应用程序的不同位置/视图上重用（它是特定于应用程序的，不打算打包在单独的库中以供将来使用）
  • 它应该具有声明性标记，以便开发人员易于阅读（无扩展方法、TagBuilder 等）；
  • 它应该接收指定其行为方式的选项列表（showCloseBtn:true, SaveUrl:{...} ），一些用于处理事件的事件处理程序以及必要时的数据模型（用于绑定到 html 控件）
  • 它是可观察的；它可以生成事件并通知注册到这些事件的任何人（我的意思是在客户端）；类似的行为发生在 Telerik 控件上，但在我们的例子中，声明性方法存在局限性（我们不想构建类库）。

样本：

@(Html.Telerik().Upload()
    .Name("attachments")
    .ClientEvents(events => events
        .OnLoad(
        @<text>
            function(e) {
                // Perform required actions here.
            }
        </text>)
    )
)
  • 某些组件每页仅使用一次，其他组件可能会出现多次，具体取决于选项参数
  • 每个组件都需要渲染 html 和 javascript
  • 能够从客户端请求组件会很好

示例（这只是为了澄清问题，这不是我需要解决的特定情况）：

假设我们有一个管理某些部门角色的应用程序。我们有一个 Person 实体，它有 Name、Age、DepartmentId（假设它只能属于一个部门）。我们为 Edit/Insert 创建了一个 PersonComponent 表单，其中包含 Name、Age 的标签/文本框和部门的 ddl。它还有一个保存按钮。当单击保存 btn 时，根据组件的初始化方式，它会从字段中获取所有数据，然后进行 ajax 调用，将 json 数据发送到 url（url 作为参数接收）并向任何人发送 Save 事件挂号的。保存事件处理程序有一个包含 json 数据的参数。如果没有 url 作为参数发送到组件，它只会通知所有侦听器（如果有）。

每个部门都有不同的视图，可以重用组件。一个页面一次可以显示多个部门。

需要考虑的事项：

  • 要创建这些组件，我们可以使用声明性 HtmlHelpers、PartialViews 或 RenderAction 助手（或其他方法？）
  • 如果一个组件每页只使用一次，但页面有多个组件，每个组件最好实际获取自己的业务数据，以避免父容器需要获取每个组件的数据
  • 如果同一组件在同一页面上多次出现，最好不要复制 javascript 代码；（这里有相关的讨论）
  • 对于 PartialViews，ViewModel 必须封装组件选项、模型数据和事件处理程序。
  • 将 HtmlHelper 渲染为对客户端请求的响应有点奇怪
  • 拥有事件机制以使组件可重用非常重要；仅仅将一些 html 渲染为组件/控件是不够的
  • 架构/解决方案可能包括一些客户端 api，例如 require.js（用于加载组件 js）、knockout.js 或其他；重要的是不要让依赖关系过于复杂，但如果它们有帮助就使用它们

笔记：

这里和这里有类似的问题，但问题的上下文不同。

4

0 回答 0