zoukankan      html  css  js  c++  java
  • mvc基础知识(1)

    复制大佬的,侵权请联系我主动删除

    1.js/css合并

    在之前的crud例子中,我们引入js/css脚本的方式和平常的web开发一样

    [javascript] view plain copy
     
    1. <script src="~/Scripts/jquery-1.8.2.min.js"></script>  
    2.     <script src="~/Scripts/jquery.validate.min.js"></script>  
    3.     <script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>  

    但是mvc框架提供了一个强大的js/css脚本合并功能

    我们找到App_Start文件夹下的BundleConfig.cs类

    双击打开

    虽然代码看不懂,但是我们可以从中看到一大堆引入js和css脚本的路径

    下面我们模仿其格式,尝试自己添加

    [csharp] view plain copy
     
    1. bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(  
    2.                         "~/Scripts/jquery.unobtrusive*",  
    3.                         "~/Scripts/jquery.validate*"));  
    4.   
    5.   
    6.             //自己添加的ScriptBundle--MyScript  
    7.             bundles.Add(new ScriptBundle("~/bundles/MyScript")  
    8.                 .Include("~/Scripts/jquery-1.8.2.min.js",  
    9.                 "~/Scripts/jquery.validate.min.js",  
    10.                 "~/Scripts/jquery.validate.unobtrusive.min.js"));  
    [csharp] view plain copy
     
    1. //开启合并压缩功能  
    2.             BundleTable.EnableOptimizations = true;  

    ok,搞定~

    这就完成了j脚本的合并引用

    那么之前的视图页就不需要之前的方式了

    现在我们将原来的三个js脚本引用删掉

    换上新代码

    [csharp] view plain copy
     
    1. @Scripts.Render("~/bundles/MyScript")//此处的路径填写new ScriptBundle("~/bundles/MyScript")中的路径名,这是可以随意命名的,譬如也可以变这样:new ScriptBundle("~myjs")  

    我们通过开发人员工具来看看两次的对比

    未使用js合并之前

    发送了三个js请求到服务器

    使用js合并之后

    三个请求合为一个,当程序规模比较大的时候页面中的js/css引用非常多,如果按照正常的方式来引用脚本会向服务器发送大量的请求

    js合并功能帮我们解决了这个问题,而且它不仅仅是将三个js文件合并在一起,还进行了压缩优化,可以通过服务器的相应正文看到

    使用css合并压缩也是一样的,根据BundleConfig.cs中的格式添加一个StyleBundle在引用就搞定~

    神技能,get it!

    ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

    2.HtmlHelper,UrlHelper

    在mvc框架中为程序员提供了一些能够进行快速看法的帮助类

    下面举例子介绍HtmlHelper和UrlHelper类

    (1)Url.Action与Url.RouteUrl

    回想一下之前的crud例子

    我们在写url地址的时候都是直接写死的

    例如:

    [html] view plain copy
     
    1. <td>  
    2.                     <href="/Home/Create">新增</a>  
    3.                 </td>  

    这样看起来似乎没有什么问题

    但是在mvc中这就是一个隐藏的巨大问题

    因为在mvc中,我们可以随意的通过配置路由在更改url的请求格式!

    [csharp] view plain copy
     
    1. routes.MapRoute(  
    2.                 name: "Default",  
    3.                 //之前的路由配置  
    4.                 //url: "{controller}/{action}/{id}",  
    5.                 //现在改为:  
    6.                 url: "{action}/{controller}/{id}",  
    7.                 defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional }  
    8.             );  

    这么一来,新增超链接请求的就是Create控制器下面的Home方法

    但是服务器端只有Home控制器下的Create方法!如果不对url进行修改的话会返回无法找到该方法的错误

    那么就改呀

    但是仔细想想

    如果项目规模非常大,url非常多

    难道要一个个去改吗?!

    先不说花费大量功夫终于改完了

    突然接到通知说路由配置又要改

    oh~shit!

    但是不要慌~

    万能的mvc框架为你提供了解决方案~

    将之前的url改为使用UrlHelper的格式

    使用Url.Action方法

    第一个参数指定action方法名,第二个参数指定控制器名

    之后生成运行,查看生成的新增超链接

    搞定~而且使用UrlHelper类生成的超链接是根据路由配置来生成的

    程序员再也不用操心前台url的格式了~

    (但是这里看到这个url有点奇怪,怎么只有Create没有Home,这是因为在路由配置中默认的控制器就是Home,而默认的action为Index,如果请求的控制器或者action方法是默认的它直接省略不写~)

    使用Url.Action方法是根据路由表中的第一个路由来生成的

    但是通常路由表中的路由不仅仅是一个,也有可能很多个

    这时候如果我们需要根据第n个路由配置来生成url怎么搞?

    使用Url.RouteUrl方法

    如图所示

    该方法可以根据指定的路由名称来生成url

  • 相关阅读:
    Oracle Haip无法启动问题学习
    OGG-Veridata如何对比没有主键的表?
    除PerfDog之外,还有什么性能测试工具。
    test
    Android系统WiFi网络架构
    audit2allow 添加SELinux权限
    select、poll、epoll之间的区别总结
    属性问题展开的selinux权限介绍
    android property属性property_set()&& property_get() selinux权限问题
    关于网络&wifi基础内容
  • 原文地址:https://www.cnblogs.com/xhxsk/p/8574594.html
Copyright © 2011-2022 走看看