如何为 ASP.NET MVC 3 + Razor 视图封装可重用的“控件”

2024-03-22

我正在寻找有关如何创建可在多个 MVC 3 视图上使用的可重用“控件”的最佳实践。我可以创建一个 Html 帮助程序扩展方法(以编程方式或使用 razor 中的声明性帮助程序),或者我可以创建一个部分视图。

就我而言,诀窍是我需要做的不仅仅是将一些 HTML 转储到视图调用帮助器/部分的位置。除了在该位置放置一些 HTML 标记之外,我还需要添加一些 javascript 代码以使其正常工作。通常,我会将此代码放在页面的其他位置(例如底部)。这当然不是严格要求的。另请注意,javascript 不是特定于控件实例的。换句话说,可以编写 JavaScript 来查找页面上控件 HTMl 标记的所有实例,并使用适当的事件等“激活”它。

我想到了几种可能性。

  1. 让助手/部分转储 HTML 和<script>标签就在它被调用的地方。这似乎是一个坏主意,因为这意味着该控件每页只能使用一次。
  2. 有两个帮手。第一个输出 HTML 标记,第二个输出 javascript。第二个只会被调用一次,并且会从页面底部调用,以便脚本最终出现在正确的位置。如果我发明了第二个这样的控件,我将有 4 个助手(2 个用于 HTML,2 个用于 Javascript)。
  3. 发明某种可以向控件注册 javascript 的 ScriptManager。脚本管理器将有某种帮助程序,该帮助程序将添加到页面底部,并为所有注册了某些脚本片段的控件转储 JavaScript。对 scriptmanager 帮助程序的调用可以位于 _layout.cshtml 中,以便它自动发生在任何需要它的页面上。当页面不需要它时,它不会执行任何操作。我猜这看起来不太像 MVC。
  4. 只需使用一个助手来输出 HTML,然后将 javascript 添加到每个页面上包含的 site.js 中即可。如果 JavaScript 在页面上找不到任何相关标记(标记将具有具有特定类的包装元素),那么它会足够聪明,不会执行任何操作。不过,在所有页面上搜索标记都会产生开销,包括没有任何这些控件的页面。
  5. 与 #4 相同,但将 javascript 放入其自己的 .js 文件中,并仅将其包含在使用该控件的页面上。这对于不使用该控件的页面来说更有效,但对于使用该控件的页面来说,它是一个附加的 .js 文件和关联的 HTTP 请求。

我倾向于#4,但这是一个已解决的问题吗?有更好的第六种选择吗?


我的公司正在使用 MVCContrib 可移植区域将代码打包到 DLL 中,以供可重用的“组件”

这些组件中的每一个都可以通过扩展方法来调用。例如:

Html.Components().ShowPoll();

在每个组件中,都有一种方法可以注册多个作为嵌入资源的 css/js 文件。我们的主站点将提取资源文件并在提供之前缩小+组合它们。

该组件还将注册在 JQuery 的 Document.OnReady 事件期间调用的任何页面事件。这使得每个组件都成为迷你站点、具有自己的路由、模型和视图的独立功能。

在整个站点中,为所有组件提供相同的 zip up JS。一是因为文件将被缓存,二是消除了确定页面上有哪些组件及其所需资源的复杂性。

如果您想了解有关此设置的更多信息,请告诉我。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何为 ASP.NET MVC 3 + Razor 视图封装可重用的“控件” 的相关文章

  • React Native 将样式设置为 State

    我想用backgroundColor of style1作为一种状态 并在函数中改变它change 我怎样才能访问style1 我的观点是调用该函数change从另一个函数 使按钮将其颜色更改为黄色 然后在一段时间后再次将其颜色更改为蓝色
  • 如何检索 jquery $.ajax 对象的responseJSON属性[重复]

    这个问题在这里已经有答案了 我有这个 JavaScript ajax ajax type GET url DBConnect php data dataType json success function data error functi
  • 在 HTML SELECT 标记中禁用键盘

    我想禁用 HTML SELECT 标记的键盘 以便用户只能使用鼠标来选择选项 我试过了event cancelBubble true on the onkeydown onkeyup and onkeypress没有运气的事件 有任何想法吗
  • 如何使用 JqGrid 子网格进行内联编辑?

    我知道如何使用主网格进行内联编辑 但是有没有办法对子网格进行内联编辑 这是我的 JS 文件 function var lastsel list jqGrid url example php postData q 1 datatype jso
  • 了解执行模型和事件循环

    我读过很多关于JavaScript单线程执行模型 事件循环和事件队列的文章 但有一件事尚不清楚 我创建了一个小提琴来说明我的问题 http jsfiddle net yzpmf67f http jsfiddle net yzpmf67f
  • 如何将模型包含在 RedirectToAction 中?

    In the RedirectToAction下面 我想通过一个viewmodel 如何将模型传递给重定向 我设置了一个断点来检查模型的值 以验证模型是否正确创建 这是正确的 但生成的视图不包含模型属性中找到的值 model created
  • npm 脚本:node-sass 不监视部分 sass 文件

    我有这个项目结构 src assets css sass main scss variables scss 我正在尝试编写一个 npm 脚本 该脚本将监视我的所有 scss 文件 包括部分文件 中的更改 然后仅编译我的 main scss
  • 表单未使用 AJAX 提交

    再次更新 如果有人关心的话 我之前发布的解决方案由于某种原因停止工作 我在 ajax 请求中包含了 beforeSend 并将验证表单的 js 部分粘贴到其中 现在就像一个魅力 form on submit function e e pre
  • KineticJS - 将舞台缩放到视口

    我正在努力将默认分辨率设置为 1366x756 我会根据视口来放大和缩小它 类似于此处显示的示例 http blogs msdn com b davrous archive 2012 04 06 modernizing your html5
  • JavaScript 中的常用数字

    在我的任务中 我必须编写一个程序来查找数组中最常见的数字以及它重复的次数 我写了一些东西 但只打印最大重复次数 所以我的问题是如何打印这个元素的值 最大数量 在我的例子中是 4 var array 13 4 1 1 4 2 3 4 4 1
  • 找到的构造函数都无法使用可用的服务和参数 Autofac 进行调用

    我已阅读并编码以下示例 http timschreiber com 2015 01 14 persistence ignorant asp net identity with patterns part 1 http timschreibe
  • 使用JS将图像的特定背景颜色设置为透明

    我正在使用以下代码来修改图像的透明度 然而 我想做的只是修改图像的背景颜色并将其 alpha 通道设置为 0 而不是整个图像 以下代码将整个图像的 Alpha 透明度设置为 0 var ctx this data getContext 2d
  • 在 NPM 上捆绑并发布客户端 Web 代码

    我制作了一个 JavaScript 文件 假设它的内容是这样的 let myCoolAlert str gt alert str in a different js file SO doesn t allow you to cross fi
  • 避免 AngularJS 部分视图在 IE 中缓存

    我正在开发一个 ASP NET MVC 应用程序 它也有一些 angularJS 我有一个主页 其中有不同的选项卡 当您单击它们时 它们会加载角度部分视图 主页是这样的 div class widget div div class widg
  • Firefox OS 后台服务

    我想构建一个应用程序 用户可以通过它输入一些设置 并且应用程序将启动后台服务来根据这些设置执行一些任务 我只想在模拟器中运行应用程序和后台服务 我知道它需要 认证 模式才能运行后台服务 但我现在不考虑在 Firefox Marketplac
  • 替换 Javascript 中的引号?

    对于我正在制作的网络应用程序 我将收到文本字符串 其中偶尔包含引号 因为我接下来要 document writing 字符串 所以需要将它们更改为撇号或转义 我该怎么做 因为当我尝试时它似乎不起作用 特别是我认为因为字符串的引号阻止了脚本的
  • 将 javascript 变量发送到服务器端 ASP .NET

    我需要在回发时将 JavaScript 数据传递到服务器端 Exvar jsVariableToPass new Object jsVariableToPass key1 value1 jsVariableToPass key2 value
  • 如何在变量名中使用变量

    所以我正在使用这样的 json 变量 opponentInvData item1 它包含项目 1 到 6 我需要动态访问不同的项目并将它们设置为空 itemNum 是我需要访问的特定项目 我正在尝试使用 eval 函数 var itemNu
  • 如何在odoo中重写js函数

    我想加载 shop checkout url 函数是 odoo define change info order website sale change info order function require use strict oe w
  • 将元素添加到 D3 圆包节点

    我正在尝试制作一个可缩放的圆形包装图 我希望每个子圆圈包含一个较小的图表 该图表始终具有相同的结构 即 4 列 只有条形的高度会改变 我尝试添加一个简单的rect到目前为止我的图表 但矩形没有添加到圆圈中并且是静态的 JS var marg

随机推荐

  • 如何等待猫鼬查询的结果?

    我尝试根据猫鼬查询的结果过滤数组 标准过滤器函数期望回调返回 true 或 false 我的麻烦是这个信息取决于 mongoose findOne 查询的异步结果 code that does not work myArray filter
  • PageSpeed 指责脚本在使用外部图像时存在“渲染阻塞”

    我在页面正文的结束标记之前放置了一个来自 CDN 的脚本 上面 谷歌的 PageSpeed Insights 说 消除首屏内容中阻碍渲染的 JavaScript 和 CSS您的页面有 1 个阻止脚本资源 这会导致页面渲染延迟 我在结束之前就
  • 使用 Visual Studio 2008 错误创建输出文件夹

    我有很多项目的解决方案 实际上有一个核心项目和一些插件 我更改了所有插件的 OutputPath 因此所有二进制文件最终都位于 Core bin debug 文件夹中 这是必要的 因为核心没有对插件的引用 因此它在编译时不会 包含 插件二进
  • Cocoa应用程序菜单-如何重新创建?

    在 MainMenu xib 中 我删除了默认的主菜单 它会自动为您提供应用程序菜单 以及文件 编辑 格式 查看 窗口 帮助菜单 我需要采取哪些步骤才能将其添加回我的应用程序中 我将创建一个新应用程序 然后仅复制Main Menu回到你的M
  • 如何限制Java 8应用程序消耗的总内存?

    为了限制 Java 7 应用程序消耗的总内存 我可以使用以下公式 取自本文 https plumbr eu blog why does my java process consume more memory than xmx 最大内存 Xm
  • VB6:如何从日期类型中删除时间部分

    我有一个Date还包含时间的变量 Dim dt As Date dt 8 3 2016 7 10 40 AM gt 以某种方式删除时间 所以结果应该是 dt 8 3 2016 怎么去掉时间呢 对于另一个日期类型变量 dt DateValue
  • Rails 3 ActiveRecord:UNION

    有没有办法在 Rails 3 中使用 MySQL UNION 我认为让其工作的唯一方法是直接执行查询 ActiveRecord Base connection execute SELECT REPEAT a 1 UNION SELECT R
  • 根据组枚举mysql中的行

    我有一组记录 例如 A B 1 5 1 6 1 9 2 1 2 8 其中我们有两个组 A 1 和 A 2 组内记录按 B 中的值排序 我需要在每个组中添加一个带有枚举的列 A B C 1 5 1 1 6 2 1 9 3 2 1 1 2 8
  • 将父类强制转换为子类

    我有 Message 类 我已经扩展并添加了新属性 class ChildMessage Message prop 在尝试将消息类添加到 ChildMessage 列表时 我得到添加类的 Null 引用 var myChildList ne
  • BMI计算器C代码[关闭]

    Closed 这个问题是无法重现或由拼写错误引起 help closed questions 目前不接受答案 我正在尝试编写一个简单的 BMI 计算器 但出于某种原因 当我尝试身高 175 公式为 1 75 和体重 70 时 它应该给出 2
  • 使用 OpenXmlReader

    我讨厌诉诸 StackOverflow 来获取如此 看似 基本的东西 但过去几个小时我一直在与 Microsoft 斗争 似乎陷入了死胡同 我正在尝试阅读 大型 Excel 2007 电子表格 Google 友好地告诉我 使用 OpenXm
  • UITableview:单击自定义按钮时动态更改单元格高度

    我有一个 UITableview 其中每个单元格都有一个按钮 我的问题是 如果我单击第一行中的按钮 单元格的高度会增加 然后我单击 tableviewcell 中的另一个按钮 已展开的单元格高度将减小 选定的单元格高度将增加 尝试此链接后U
  • Ruby on Rails:符号作为 form_for 中的参数

    我明白传递给的是什么form for执行以下操作时的方法 if user在控制器中设置 这是很明显的 但当我们经过时会发生什么 user 正如我在很多例子中看到的那样 我什么时候应该使用符号版本 使用该符号将生成
  • Objective C 类通过工厂方法继承

    我想继承一个具有工厂方法的框架类 如何使工厂方法返回我继承的类类型的对象 我发现这篇有用的文章 http qualitycoding org factory method 它描述了类似的情况 但在他们的情况下你可以控制超类 我怎么能写 比如
  • 我可以使用临时的右值引用吗?这是未定义的行为吗?

    更新问题为什么这两个右值引用示例有不同的行为 https stackoverflow com questions 35315472 why this two rvalue references examples have different
  • java.util.List 的降序迭代器

    链表可以使用升序或降序迭代器进行迭代 如下所示 LinkedList list new LinkedList StringJoiner sJ1 new StringJoiner list iterator forEachRemaining
  • 在Java 线程中使用PreparedStatements 是否正确?

    我还是一名本科生 只是在做兼职 所以我总是试图了解更好的做事方法 最近 我必须编写一个工作程序 其中程序的主线程将生成 任务 线程 对于每个数据库 任务 记录 该线程将执行一些操作 然后更新记录以表明它已完成 因此 我需要 Threaded
  • 判断两个数组是否具有相同成员的算法

    比较两个数组以查看它们是否具有相同成员的最佳算法是什么 假设没有重复项 成员可以按任何顺序排列 并且都没有排序 compare a b c d b a d c gt true compare a b e a b c gt false com
  • 如何在firebase云函数中指定声音和click_action

    我尝试使用以下函数 node js v8 exports sendComNotification functions firestore document Comunicados comID onUpdate snap context gt
  • 如何为 ASP.NET MVC 3 + Razor 视图封装可重用的“控件”

    我正在寻找有关如何创建可在多个 MVC 3 视图上使用的可重用 控件 的最佳实践 我可以创建一个 Html 帮助程序扩展方法 以编程方式或使用 razor 中的声明性帮助程序 或者我可以创建一个部分视图 就我而言 诀窍是我需要做的不仅仅是将