MVC4优化如何允许局部视图脚本?

9
在使用部分视图和MVC时,一个问题是如果您的可重用部分视图需要某些JavaScript,则无法包含它并将其加载到页面底部的脚本部分中。除了性能问题之外,这意味着必需的东西(如jquery)尚未出现,您必须使用奇怪的延迟执行任何jquery相关代码。
解决此问题的方法是允许部分视图中的部分,以便可以将其脚本注册到布局的正确位置。
据说MVC4的优化/捆绑功能应该解决此问题。但是,当我在部分视图中调用@Scripts.Render时,它会在部分视图所在的任何位置包含它们。它不会做任何魔术来将脚本放置在页面底部。
请参见Erik Porter的评论: http://aspnet.uservoice.com/forums/41199-general-asp-net/suggestions/2351628-support-section-render-in-partialviews 我看到其他一些地方的人们说MVC 4解决了这个问题,但没有任何示例说明如何解决。
如何使用MVC4优化解决问题,将部分所需的脚本包含在其他脚本之后,在body结束处添加?

脚本不应该放在局部视图中,应该在父视图中使用脚本。 - Matija Grcic
即使您将脚本外部化,仍然存在相同的挑战。我不想在父视图中混杂一堆用于局部视图的引导代码,然后在每个重用该局部视图的“父级”中重复此操作。 - AaronLS
1个回答

3
您可以做的一件事是创建一些HtmlHelper扩展方法,如下所示:

您可以做的一件事是创建一些HtmlHelper扩展方法,如下所示:

using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using System.Web.Optimization;

public static class ScriptBundleManager
{
    private const string Key = "__ScriptBundleManager__";

    /// <summary>
    /// Call this method from your partials and register your script bundle.
    /// </summary>
    public static void Register(this HtmlHelper htmlHelper, string scriptBundleName)
    {
        //using a HashSet to avoid duplicate scripts.
        HashSet<string> set = htmlHelper.ViewContext.HttpContext.Items[Key] as HashSet<string>;
        if (set == null)
        {
            set = new HashSet<string>();
            htmlHelper.ViewContext.HttpContext.Items[Key] = set;
        }

        if (!set.Contains(scriptBundleName))
            set.Add(scriptBundleName);
    }

    /// <summary>
    /// In the bottom of your HTML document, most likely in the Layout file call this method.
    /// </summary>
    public static IHtmlString RenderScripts(this HtmlHelper htmlHelper)
    {
        HashSet<string> set = htmlHelper.ViewContext.HttpContext.Items[Key] as HashSet<string>;
        if (set != null)
            return Scripts.Render(set.ToArray());
        return MvcHtmlString.Empty;
    }
}

从您的局部文件中,您可以像这样使用它:

@{Html.Register("~/bundles/script1.js");}

在您的布局文件中:

   ...
   @Html.RenderScripts()
</body>

由于您的局部文件在布局文件结束之前运行,因此所有脚本包都将被注册并安全地呈现。


你是指要加载文件名,请使用 @{Html.Register("~/bundles/script1.js");} 或者根据你的 ~/bundles... 符号所暗示的在 BundleConfig.cs 中设置的 bundle,使用 @{Html.Register("~/bundles/scriptbundle");} 来加载。让我知道是否有帮助 - 谢谢。 - Robert Achmann

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接