位置: 编程技术 - 正文

在ASP.NET MVC项目中使用RequireJS库的用法示例(asp.net mvc view)

编辑:rootadmin

推荐整理分享在ASP.NET MVC项目中使用RequireJS库的用法示例(asp.net mvc view),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:asp.net mvc教程,asp.net mvc工作原理,asp.net mvc 部署,asp.net mvc 部署,asp.net mvc怎么样,asp.net mvc运行流程,asp.net mvc运行流程,asp.net mvc工作原理,内容如对您有帮助,希望把文章链接给更多的朋友!

RequireJS 是一个前端模块化开发的流行工具,本身是一个Javascript的库文件,即require.js 。RequireJs的主要功能:

(1)实现js文件的异步加载,避免网页失去响应;

(2)管理模块之间的依赖性,便于代码的编写和维护。

前端模块化开发现在有好多的工具,大体上分为两类,一类是像dojo之类的高大全,dojo v1.8之后已经内置了模块化开发组件;另一类是像require.js,sea.js 这种专心做模块化开发的工具。

从模块化划分的规则来区分,主要分为AMD、CMD两类,dojo、require.js 遵从前者,而sea.js 依循CMD规范。

require在单页面应用中能够如鱼得水,然而对于传统的多页面应用,使用require多少会有些困惑和不方便。

本文讲解如何在ASP.NET MVC的结构中应用require,并且给出了压缩脚本,实现半自动化压缩。

将js代码分离一般而言ASP.NET MVC的一个路由对应一个视图,视图的文件结构可能如下:

这里假设_layout.cshtml是所有页面共享的。一般情况下,我们会在_layout中引用公共的js类库,比如jQuery,bootstrap等,这样的话其他的页面就不需要对这些类库再引用一遍,提高了编码的效率。然而,不同的页面终究会依赖不同的js,尤其是实现页面本身功能的自定义的js,这样我们不得不在其他页面中再引用特殊的js,甚至将js直接写在页面中,例如下面的代码经常会出现在View中:

在ASP.NET MVC项目中使用RequireJS库的用法示例(asp.net mvc view)

这样会导致页面比较混乱,而且页面<script>标签中代码不能被浏览器缓存,增加了页面代码的长度。更为重要的缺陷是,诸如jQuery之类的类库会在加载到页面后执行匿名函数,这需要一些时间,而如果有些页面根本不需要jQuery的话,只要页面把_layout作为布局页面,那么jQuery的初始化代码将不可避免的执行,这是一种浪费。事实上,javascript的模块化加载的思想就是为了解决这些问题的。

接下来我们来用require规划我们的js,构建诸如下面结构的js目录

把公共的类库级别的js模块直接放在js目录下,而把页面级别的js放在一个app的子目录下。注意,在app中,每个页面一个js文件,这意味着我们需要把页面各自的js提取出来,虽然这样增加了结构复杂度,但是避免了在页面中随手写<script>标签的陋习。另外,在js目录下的公共库,除了第三方的库,还包括自己开发的库,还有一个叫config.js的文件,这个文件很关键,稍后会说到。

然后,我们可以删除_layout中所有的js引用,并使用@RenderSection的命令要求子页面提供js引用,_layout.cshtml:

这样对js的需求就下放到每个view页面中了,根据require的用法,我们需要在各个子View中引用require.js,并指定主模块,而这些主模块就是上面app目录下的一个个js

所有的js代码都将写到app下的js中,这样规范了js,使得页面更干净,更为重要的是这些js还可以经过压缩,以及被浏览器缓存等,进一步提高执行效率

公共的config我们知道主模块除了使用require方法外,经常需要通过require.config来配置其他模块的路径,甚至需要shim,例如下面的代码经常会出现在主模块的开头:

对于单页面应用来说,主模块往往只有一个,所以上面的代码写一遍也就OK了。但是,在多页面的情况下,主模块有多个,每个主模块都要包含这样的代码,岂不是很不科学?于是,希望有一个统一配置的地方,但是应该如何来写呢?我们想到,将这些配置作为一个模块config.js,让其他的主模块对这个模块产生依赖就可以了,例如下面的config.js:

config.js的写法没有什么特别的,接下来只要在home.index.js中引用

不过这样写还是不对的,因为,被主模块依赖的模块(这里的config,jquery,bootstrap),在加载的时候,加载顺序是不确定的,但是又需要config模块在其他模块之前加载,怎么办呢?一个折衷的方案是修改home.index.js,成为如下代码:

使用一个命名的模块home.index2作为过渡,在主模块中手动require,这样可以保证config在主模块执行之前加载,也就使得home.index2在加载的时候已经加载了config了。

压缩require提供一个压缩工具,用于压缩和合并js,详情请移步至

理解javascript中的with关键字 说起js中的with关键字,很多小伙伴们的第一印象可能就是with关键字的作用在于改变作用域,然后最关键的一点是不推荐使用with关键字。听到不推荐with

仅行代码实现Javascript中的MVC 从年左右开始,MVC逐渐在前端领域大放异彩,并终于在刚刚过去的年随着ReactNative的推出而迎来大爆发:AngularJS、EmberJS、Backbone、ReactJS、RiotJS、VueJS

谷歌showModalDialog()方法不兼容出现对话窗口的解决办法 showModalDialog,在测试中,IE,Firefox中正常运行,但是在google中,点击后没什么反应,在网上看了一下,谷歌浏览器不支持showModalDialog模态对话框和无法

标签: asp.net mvc view

本文链接地址:https://www.jiuchutong.com/biancheng/381664.html 转载请保留说明!

上一篇:获取阴历(农历)和当前日期的js代码(查找阴历日历)

下一篇:理解javascript中的with关键字(对于javascript理解)

  • 生产税净额计算实例
  • 运输费劳务是否可以扣除
  • 来料加工账务处理举例
  • 成本计算账户期末一般有余额吗
  • 支付外国公司费用要交税吗
  • 企业所得税抵扣项
  • 讲师讲课费标准2019
  • 甲公司自2018年3月1日开始自行研发一款新兴产品
  • 缓缴税款到期缴纳填主表第几行
  • 财务报表有哪些局限性
  • 车辆增值税抵扣到什么时候结束
  • 外经证预交增值税和专管员
  • 修理厂专票怎么开
  • 作进项税转出
  • 影视行业如何盈利
  • 企业捐赠现金支出应在哪个项目反应
  • 银行短期理财利息怎么算
  • 光伏安装工程公司有哪些
  • 支付借款利息怎么做账
  • 32位升级64位系统教程
  • qbupdate.exe - qbupdate是什么进程 有什么作用
  • php写接口实现json文件读取
  • 分级核算下的建议怎么写
  • PHP:curl_version()的用法_cURL函数
  • TypeError: Cannot read properties of undefined (reading ‘NAME‘)报错解决
  • 发行股票的手续费、佣金如何会计处理?
  • Pycharm安装库失败
  • 夜间潜水时发现水体
  • 计算所得税费用公式excel
  • 投资性房地产成本法账务处理
  • 支付税务罚款
  • 办公用品属于会计科目中的什么
  • php parse_str() 函数的定义和用法
  • 先付款后收到发票怎么入账
  • 异步函数执行顺序
  • vue 绑定子组件属性
  • web攻防之业务安全实战指南在线阅读
  • 小规模企业应交税费
  • 个人发票抬头和公司发票抬头有什么区别
  • 无形资产入股后大幅缩水怎么办
  • 视同销售如何做账务处理?
  • 其他收益包含
  • 增值税发票是记账联还是抵扣联
  • 房租押金需要缴税吗
  • PostgreSQL教程(十六):系统视图详解
  • 跨年的房租费用怎么做账
  • 购买债券收到的现金
  • 企业的项目有哪些
  • 存货报废进项税额需要转出吗
  • 长期股权投资的账务处理
  • 现金折让的账务处理
  • 2018年所得税税收优惠
  • 个体工商户法人可以变更吗?
  • 原材料用于在建工程进项税可以抵扣吗
  • 卖二手车买卖
  • 转让无形资产使用权税率
  • 上年的原材料发票可以算今年的成本吗
  • 购进货物用于集体福利会计分录
  • ubuntu笔记软件
  • win10开始无法打开
  • securecrt keymap
  • centos sudoers
  • win7系统玩红色警戒怎么全屏设置
  • win7系统安装软件重启电脑后就没了
  • linux的复制
  • nodejs解析路径
  • nodevideo翻译
  • jquery实战
  • js怎样删除数组中的某个值
  • vue分页组件page
  • 解决口苦的最佳方法
  • python模块怎么用
  • jquery Deferred 快速解决异步回调的问题
  • jquery过滤选择器按照过滤规则分类包括?
  • jquery trigger 传参数
  • 开个人发票有什么好处?
  • 仓库需要交房产税吗
  • 海关进口增值税专用缴款书在哪里打印
  • 企业年金个人缴纳的辞职能拿吗
  • 票种核定在电子税务哪里查
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设