在 MVC 4 中制作可切换的桌面和移动页面答案

【问题标题】：Making a switchable Desktop and Mobile page in MVC 4在 MVC 4 中制作可切换的桌面和移动页面
【发布时间】：2014-12-27 05:41:57
【问题描述】：

我在 MVC4 中创建了一个自适应网站。我知道如何使用 viewswitcher 在整个网站的桌面和移动视图之间切换。我的问题是当有人从移动设备访问该页面时，我想将单个页面切换到桌面视图。

例如：有一个ActionResult 测试，因此当一个人从桌面访问此页面（测试）时，默认情况下会显示桌面视图，但是当一个人再次从移动设备访问同一页面时，应该显示桌面视图的移动。由于我的网站是自适应的，所以有一个_Layout.Mobile.cshmtml 页面，当有人来自移动设备时会自动呈现该页面。为避免这种情况，我创建了test.Mobile.cshtml 页面，在该页面中我设置了Layout = null; 并复制粘贴了所有_Layout.cshtml html，但由于移动设备有媒体查询，我的所有桌面css 都被覆盖，这不能达到目的.

所以我的问题是如何在桌面和移动设备之间切换单个页面，而不是整个网站。所有其他页面都应按原样运行（自适应）。

【问题讨论】：

标签： .net asp.net-mvc asp.net-mvc-4 viewswitcher

【解决方案1】：

假设有问题的视图是一个“完整”页面（意味着它没有布局页面并且包含一个格式良好、完整的 HTML 页面），您只需要从该视图的头部省略 viewport 元标记。如果您不熟悉视口，Google 在这里有一篇不错的帖子：https://developers.google.com/web/fundamentals/layouts/rwd-fundamentals/set-the-viewport

如果您需要“桌面模式”可切换，那么只需在视口元素周围添加一个条件：

@if(ViewBag.EnableViewportScaling)
{
    <meta name="viewport" content="width=device-width, initial-scale=1" />
}

我假设您可以在呈现视图标记之前的某个时间点向 ViewBag 添加一个布尔属性。

【讨论】：

我忘了提到我什至这样做了，但即使这样也无济于事。有基于覆盖设计的设备宽度编写的jquery。

【解决方案2】：

据我了解，此代码必须位于`_ViewStart.cshtml'中：

@{
  if (isDesktopClient)
      Layout = "~/Views/Shared/_Layout.cshtml";
  else
      Layout = "~/Views/Shared/_Layout.mobile.cshtml";
}

所以你需要使用条件if (isDesktopClient || Request.Path == "~/Test")。

【讨论】：