asp.net-mvc - 如何在 MVC View 中处理 "magic strings"，例如元素 ID :s?

Question

在我的 MVC View 中，我经常需要从 JavaScript 中引用各种元素，为此我定义了这些元素的 id 属性。这通常与更新各种容器元素内容的 Ajax 调用结合使用。

一个简短的例子( Razor ):

<table id="PersonList">
    ...
</table>
<div id="PersonDetails">
    <!-- This would be loaded dynamically using Ajax -->
    <input type="hidden" name="CurrentPersonId" value="@Model.PersonId">
    ...
</div>

这包含三个“魔法字符串”:“PersonList”、“PersonDetails”和“CurrentPersonId”。 Ajax 调用可能如下所示:

$('#PersonDetails').load('@Url.Action("GetPersonDetails")', { PersonId: ... });

再次出现魔术字符串“PersonDetails”。

不好!

任何人都可以提出一些“最佳实践”来在一个地方定义这些魔法字符串并在 1) View 中使用它们，2) 最好是实现 Ajax 调用等的静态 JavaScript 文件，以及 3) CSS 文件？

我在想，也许 _Layout.cshtml 可以包含一个局部 View ，该 View 定义了该 Controller 甚至特定操作的魔法字符串。它将检查调用它的 Controller 和/或操作，并基于此调用适当的局部 View 。我已经为 .css 和静态 .js 做了一些类似的事情，让我简单地添加 Person.css 并自动将其包含在 Person Controller 的所有 View 中。

局部 View 会做这样的事情:

@{
    const string PersonListId = "PersonList";
    const string PersonDetailsId = "PersonDetails";
    const string CurrentPersonIdName = "CurrentPersonId";
}
<script type="text/javascript">
    NamesAndIds = {};
    NamesAndIds.PersonListId = '@Html.Raw(PersonListId)';
    NamesAndIds.PersonDetailsId = '@Html.Raw(PersonDetailsId)';
    NamesAndIds.CurrentPersonIdName = '@Html.Raw(CurrentPersonIdName)';
</script>

这应该让 Razor 代码使用 C# 字符串常量来生成适当的 HTML，并且静态 JavaScript 文件可以在 jQuery 选择器等中引用 NamesAndIds(假设在局部 View 中定义的常量将在调用 View 中可用，我对此表示怀疑(避风港)尚未检查)...如何在 .css 文件中使用它们我不知道。

有什么更好的建议吗？你如何处理这个问题？

Answer 1

我希望有人能想出更好的东西，但这至少是一些东西。

在主(非部分) View 中，顶部有一个部分定义了我需要在 C#、HTML 和 JavaScript 中的多个位置使用的 ID 和名称:

@{
    const string PersonListId = "PersonList";
    const string PersonDetailsId = "PersonDetails";
    const string CurrentPersonIdName = "CurrentPersonId";
}

在底部，我有一个脚本部分，用于将字符串分配给合适的命名空间容器对象:

<script type="text/javascript">
    MyNamespace = {};
    MyNamespace.Ids = {};
    MyNamespace.Names = {};
    MyNamespace.Ids.PersonList = '@Html.Raw(PersonListId)';
    MyNamespace.Ids.PersonDetails = '@Html.Raw(PersonDetailsId)';
    MyNamespace.Names.CurrentPersonId = '@Html.Raw(CurrentPersonIdName)';
</script>

在每个引入我需要通过 id 或名称引用的附加项的部分 View 中，我添加了类似的代码来扩展 MyNamespace.Ids和 MyNamespace.Names与所需的字符串。

现在我可以在 Razor View 代码中使用 C# 字符串常量来生成具有正确 ID 和名称的标记，并且我可以编写引用 MyNamespace.Ids 的常规静态 JavaScript 文件。和 MyNamespace.Names找到正确的 ID 和名称，例如在 jQuery 选择器中。

我还为我的 Ajax 调用使用的操作 URL 添加了类似的内容，并将它们放入 MyNamespace.Urls :

MyNamespace.Urls.GetPerson = '@Html.Raw(Url.Action("GetPerson"))';

它并不理想，但它很简单，并且解决了散落在各处的魔法字符串的最紧迫问题。它不会在编译时检测错误，但重命名项目将需要在单个位置重命名单个字符串，如果我重命名或拼写错误 MyNamespace.Ids.Something它至少会生成一个运行时 JavaScript 错误，可以在 JS 控制台或类似工具中看到。