NopCommerce 3.4中移动端访问抛弃响应式布局
在Nop3.4中,他抛弃了原来的xxx.Mobile.cshtml的这种写法,而是采用了响应式布局,并且把规则也给改了,你在后台配置不启用响应式布局,在前台你仍然不能写xxx.Mobile.cshtml这样。查了一天的原因,终于查出来了。
首先请大家了解mvc4的新特征:http://www.cnblogs.com/egger/p/3400076.html
看完这个,估计你也会被误导,认为MVC已经自己支持了.Mobile.cshtml这种写法。觉得他肯定是哪里把那个设置给禁用了,反正我就是顺着这种思路找了一个早上无果。最后我断点跟踪他Return View()的方法,发现,他根本没有用MVC自己的那个方法,而是自己重写了一套。
在Return View的时候,他请求到Nop.Web.Framework这个项目下面的Themes文件夹里面的ThemeableVirtualPathProviderViewEngine文件中,在这个文件中有这样两个方法:FindView 和FindPartialView,在这里,他在3.4版本中的做法是直接把Controller丢到FindThemeableView方法中去执行了,然后细看FindThemeableView方法,你会发现,在它这里面,他会用Controller和Aciton组合起来,最后拼成一个Nop中Cshtml的路径。
比如像这样:newLocations.Insert(0, "~/Administration/Views/{1}/{0}.cshtml"); //不是这句代码,不要在这里动手脚。。
所以,只要FindView 和FindPartialView传过来的ControllerName,你给他加上你自己的规则,那他就会生成对应的路径啦。
你看FindView里面的这句
ViewEngineResult result = FindThemeableView(controllerContext, ViewName, masterName, useCache);
很明显的,他是在拼路径,我们只要在这里,把viewName改成ViewName.Mobile就完了。
代码如下:
/// <summary>
/// 判断当前请求是不是从手机端过来的
/// </summary>
/// <param name="httpContext">HTTP context</param>
/// <returns>Result</returns>
public virtual bool IsMobileDevice(HttpContextBase httpContext)
{
//comment the code below if you want tablets to be recognized as mobile devices.
//nopCommerce uses the free edition of the 51degrees.mobi library for detecting browser mobile properties.
//by default this property (IsTablet) is always false. you will need the premium edition in order to get it supported.
bool isTablet = false;
if (bool.TryParse(httpContext.Request.Browser["IsTablet"], out isTablet) && isTablet)
return false; if (httpContext.Request.Browser.IsMobileDevice)
return true; return false;
}
IsMobileDevice
/// <summary>
/// 返回View视图
/// </summary>
/// <param name="controllerContext"></param>
/// <param name="viewName"></param>
/// <param name="masterName"></param>
/// <param name="useCache"></param>
/// <returns></returns>
public override ViewEngineResult FindView(ControllerContext controllerContext, string viewName, string masterName, bool useCache)
{
bool useMobileDevice = IsMobileDevice(controllerContext.HttpContext);//判断请求是否从手机过来
string overrideViewName = useMobileDevice ?
string.Format("{0}.{1}", viewName, _mobileViewModifier)
: viewName;//拼路径_mobileViewModifier这是个string类型的变量,你也可以直接写死称Mobile或者Wap等等,到时候,你就是viewName._mobileViewModifier.cshtml
ViewEngineResult result = FindThemeableView(controllerContext, overrideViewName, masterName, useCache);//找一下视图
if (useMobileDevice && (result == null || result.View == null))
result = FindThemeableView(controllerContext, viewName, masterName, useCache);//没找到,再去找没有带后缀的试图
return result;
}
FindView
public override ViewEngineResult FindPartialView(ControllerContext controllerContext, string partialViewName, bool useCache)
{
bool useMobileDevice = IsMobileDevice(controllerContext.HttpContext);
string overrideViewName = useMobileDevice ?
string.Format("{0}.{1}", partialViewName, _mobileViewModifier)
: partialViewName;
ViewEngineResult result = FindThemeablePartialView(controllerContext, overrideViewName, useCache);
if (useMobileDevice && (result == null || result.View == null))
result = FindThemeablePartialView(controllerContext, partialViewName, useCache);
return result;
}
FindPartialView
NopCommerce 3.4中移动端访问抛弃响应式布局的更多相关文章
- 针对移动端开发的响应式 Jekyll 主题
simple 这是针对移动端开发的响应式 Jekyll 主题,效果看 demo,源码在 GitHub,觉得不错点个 star. 主题特性包括但不限于: 在线编辑.新建.发布文章 GitHub 官方语法 ...
- 探讨兼容IE低版本的PC端响应式布局
http://www.jiangweishan.com/article/lowIeResposive.html 响应式布局,oh my god!!有点醉了,感觉是老生常谈的话题了.虽然已经谈过很多了, ...
- 移动端响应式布局--你不知道的CSS3.0媒体查询,解决rem部分情况下无法适配的场景
媒体查询作为响应式布局的方法之一,实际项目中用途也很广.但是你真的知道怎么用吗? 例如,下面匹配 iphone6/7/8 屏幕 @media screen and (max-width: 375px) ...
- 【CSS-移动端响应式布局详解】
背景 移动端响应式布局开发主要方案有: 基于rem开发 基于媒体查询 基于弹性盒 基础概念 在讨论响应式布局知识前,先了解下移动端常用基础概念. 逻辑像素(CSS pixels) 浏览器使用的抽象单位 ...
- CSS3移动端vw+rem不依赖JS实现响应式布局
1.前言 (1)vw/vh介绍 在使用之前,我们先简单了解一下什么是vw和rem以及它们的作用,vw是css3出现的一个新单位,它是"view width"缩写,定义为把当前屏幕分 ...
- 移动端开发之响应式开发和bootstrap基础
响应式开发 (就是利用媒体查询针对不同宽度的设备进行布局和样式的设置,从而设配不同设备的目的) 响应式布局容器响应式需要一个父级作为布局容器,来配合子级元素来实现变化效果 原理:不同屏幕下,通过媒体查 ...
- PC 端响应式布局
前言:PC端 电脑显示器的尺寸种类还是很多的,台式电脑和笔记本电脑尺寸相差就更明显,所以响应式布局还是很重要的,甚至是必须要考虑的. 响应式的页面好不好,在后管平台上很明显.因为后管平台,一般是全屏显 ...
- Css3中的响应式布局的应用
Media Queries直译过来就是“媒体查询”,在我们平时的Web页面中head部分常看到这样的一段代码: <link href="css/reset.css" rel= ...
- 响应式布局中的CSS相对量
一个响应式布局,要能够根据设备屏幕尺寸的改变,动态的调整页面内容,展现不同的设计风格. 在进行响应式的 CSS 代码编写过程中,经常会用到一些相对尺寸,以达到相对定位的目的.例如,常见的响应式布局中需 ...
随机推荐
- C Primer Plus note4
warning: implicit declaration of function 'pirntf' [-Wimplicit-function-declaration]| 这种警告是因为使用了 没有声 ...
- JDK自带工具keytool生成ssl证书 和 HTTPS双向认证
创建证书(第一步) keytool -genkey -alias "baidu" -keypass "123456" -keystore "D:/ba ...
- 重构指南 - 封装条件(Encapsulate Conditional)
封装就是将相关的方法或者属性抽象成为一个对象. 封装的意义: 对外隐藏内部实现,接口不变,内部实现自由修改. 只返回需要的数据和方法. 提供一种方式防止数据被修改. 更好的代码复用. 当代码中包含 ...
- 纯css面板插件,自适应,多样式
最近在做公司的系统后台,用的bootstrap,在设计布局的时候不喜欢他的面板,所以自己写了这个面板插件,分享给大家 先上预览图: 默认样式: 绿色: 黄色: 蓝: 红: 使用方法: 引用MoUi.c ...
- SQLServer导入大sql文件报错 对 COM 组件的调用返回了错误 HRESULT E_FAIL。 (mscorlib)
打开cmd执行(d:\script.sql为sql文件位置): sqlcmd -S 127.0.0.1 -U sa -P sa -i d:\script.sql From:https://ww ...
- Intellij IDEA快捷键大全汇总
Alt+回车 导入包,自动修正 Ctrl+N 查找类 Ctrl+Shift+N 查找文件 Ctrl+Alt+L 格式化代码 Ctrl+Alt+O 优化导入的类和包 Alt+Insert 生成代码 ...
- Java集合排序
[ 1.对普通的包装类基本数据类型的list数组排序(Integer,Long,Double) ] Collections.sort(List list) [例] List<Long> m ...
- GIS与FVCOM模型耦合的关键技术及解决思路
1. FVCOM本身为Linux下的MPI程序,首先将其移植到Windows下,可以编译成控制台程序. 2. FVCOM的前处理由GIS完成剖分网格和初始设定等工作. 3. FVCOM的输出采用自定义 ...
- Vue2.0的动画效果
本文只是结合一些代码和图片加强对Vue动画的理解,更多资料请戳这里 结合原生CSS实现动画 下面是一张图片,简单清晰明了是吧^-^ 下面是一段代码 <!DOCTYPE html> < ...
- 二、Flex 布局教程:实例篇
注:本文转自大神阮一峰,自己加了少许改动~ 上一篇文章介绍了Flex布局的语法,今天介绍常见布局的Flex写法. 你会看到,不管是什么布局,Flex往往都可以几行命令搞定. 我只列出代码,详细的语法解 ...