Question

我正在将我的网站从aspx转换为cshtml（Razor）。除了我的2或3列母版页的问题并试图将它们转换为cshtml布局页面之外，这种情况还不错。

在Razor中，我基本上为我的所有部分创建了单独的页面，然后使用@RenderPage从布局页面调用这些页面。也许这本身就错了？基本上除了主内容部分之外，所有部分都显示得很好，主要内容部分基本上是我希望在其中显示的3（或2）列的包装。我已尝试过各种方法来执行此操作，但要么只是在页面宽度上显示1个主列，要么将列显示在彼此上方，但其他2的格式不正确。我知道所有的CSS等在aspx中工作正常，但我显然在Razor中做错了。

CSHTML新布局页面

<body>
    <div id="container">
        <div id="top">
            @RenderPage("~/Views/Shared/_Top.cshtml")
        </div>
        <div id="header">
            @RenderPage("~/Views/Shared/_Header.cshtml")
        </div>
        <div id="nav">
            @RenderPage("~/Views/Shared/_Nav.cshtml")
        </div>

        <div class="main">
            @RenderPage("~/Views/Shared/_Main.cshtml")

            <div class="columnVerySmall">
                @RenderPage("~/Views/Shared/_ColumnVerySmall.cshtml", false)
            </div>

            <div id="columnLarge">
                @RenderBody()
            </div>

            <div id="columnSmall">
                @RenderPage("~/Views/Shared/_ColumnSmall.cshtml", false)
            </div>
        </div>

        <div id="footer">
            @RenderPage("~/Views/Shared/_Footer.cshtml")
        </div>

        <div id="scripts">
            @RenderPage("~/Views/Shared/_Scripts.cshtml")
        </div>
    </div>
</body>

旧ASPX母版页：

<div class="main">
<main role ="main" class="mainWrapper">
        <div class="columnVerySmall">
            <asp:ContentPlaceHolder ID="columnVerySmallContent" runat="server"></asp:ContentPlaceHolder>
        </div>
        <div class="columnLarge">
            <asp:ContentPlaceHolder ID="columnLargeContent" runat="server"></asp:ContentPlaceHolder>
        </div>                       
        <div class="columnSmall">
            <asp:ContentPlaceHolder ID="columnSmallContent" runat="server"></asp:ContentPlaceHolder>
        </div>
</main>
</div>

Answer 1

我已设法通过更改主要部分来解决此问题，如下面的代码块所示。我基本上将“Main”代码添加到我的布局中，然后将@Render添加到列中。我真的没有看到我如何通过为“Main”创建一个单独的页面，然后使用@RenderPage从布局页面调用它，就像我最初尝试的那样。这是我改变的：

    <div class="main">
        <main role="main" class="mainWrapper">
            <div class="columnVerySmall">
                @RenderPage("_ColumnVerySmall.cshtml")                  
            </div>
            <div class="columnLarge">
                @RenderBody()
            </div>
            <div class="columnSmall">
                @RenderPage("_ColumnSmall.cshtml")
            </div>
        </main>
    </div>

从aspx重构为cshtml（Razor）

1 个答案: