MVC学习之HtmlHelper
1.为什么要使用HtmlHelper?
1.首先HtmlHelper是一个类型,MVC中的ViewPage<TModel>中的一个属性Html属性,这个属性的类型就是HtmlHelper<TModel>类型的,这样封装后最后产生的代码和我们手写的html代码是完全一样的,没有任何冗余,同时可以使得我们直接“点“出来想要的标签,方便开发。
2.可是只是可以“点”出来这点优势,好像没有什么说服力,因为这些HtmlHelper代码需要后台处理后才能转换成html代码,多走了一个流程,还有另一个优势就是HtmlHelper生成的html代码他是根据路由规则去匹配的,也就是以后你修改了路由规则也是不影响的,实现了路由规则和前端界面的解耦(比如超链接标签),
3.使用HtmlHelper可以实现更加强大自动绑定。可以直接和ViewData["username"]="123"进行绑定,当然前提是前端的名字和ViewData的名字一样
2.HtmlHelper的使用
(1)超链接
1 | <%:Html.ActionLink( "链接到Index" , "Index" , "Home" , new {name= "ww" , age= "ss" }, new { id= "1" ,@ class = "cls" }) %> |
对于上面的@class这个是讲class进行转义,因为在C#中class是一个关键字,对于ActionLink中有很多的重载,可以设置属性,确定控制器和行为
等效
1 | <a calss= "cls" href=“/Home/Indx/1?name=ww&age=ss”>链接到Index</a> |
(2)下拉列表
1 2 3 4 5 6 7 8 9 | <% List<SelectListItem> list = new List<SelectListItem>(); list.AddRange ( new SelectListItem []{ new SelectListItem() { Text= "大学" ,Value = "0" ,Selected = false }, new SelectListItem (){ Selected= true ,Text = "高中" ,Value = "1" } }); ViewData[ "drop" ] = list; %>> <%:Html .DropDownList( "drop" , null , new {id = "33" }) %> |
上面可以发现已经实现与ViewData的自动绑定,否则使用手写的话没法实现,Form标签也只是使用强类型页面实现绑定
(3)单选按钮
1 | <%:Html.RadioButton( "sex" ,0) %>男 <%:Html.RadioButton( "sex" ,1) %>女 |
(4)form表单
1 2 3 | <% using (Html.BeginForm( "Index" , "Home" ,FormMethod.Post, new {id= "form1" , enctype= "" })){ %> <input type = "submit" value = "提交" > <%} %> |
因为BeginForm方法返回类型继承自IDispose,所以使用using。
(5)关于For系列
对于每一个Html中的标签都有两个方法,一个带有for,一个不带for,上面展示的都是没有for的展示
对于for系列,可以使用Lambda表达式,这种方法经常和强类型页面一起使用
Html.TextBoxFor(userInfo=>UserInfo.UserName,new{id ="ss"})
3.关于ASPX引擎中的输出,可以使用“=”,也可以使用“:”
这两种方式都是可以实现打印出来的效果,“=”当字符串中含有html代码的时候,可以将html代码翻译出来,但是这种方式存在安全危机,也就是容易引发页面安全错误提示
“:”是将字符串中的html代码原阳输出,也就是实现了EnCode操作,增加安全性,防止跨脚本攻击,但是倘若想要打印出翻译后的结果如何处理呢?,此时可以模仿一下微软的处理,因为微软中的HtmlHelper中就是将html翻译出来的,也就是MvcHtmlString类
<%:MvcHtmlHelper.Create(ViewData["ss"].ToString())%>
这样就OK了,所以综上所述,建议使用“:”输出,而不是使用“=”。
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步