asp.net 已声明cshtml视图中的定义JavaScript变量

pftdvrlh  于 2023-03-31  发布在  .NET
关注(0)|答案(2)|浏览(144)

我在IndexJson.cshtml视图中定义了一个变量:

@section Scripts{
    @await Html.PartialAsync("_ValidationScriptsPartial")
    <script type="text/javascript">
        var area = "@ViewContext.RouteData.Values["area"].ToString()"
    </script>

如果我离开视图,然后重新访问它,那么我会得到:
标识符“area”已声明
我有一个左菜单,我做了一个 AJAX 调用,然后在一个容器中分配HTML视图,如:

function MenuClickItem(item) {
    $.ajax({
        type: "GET",
        url: item.dataset.area + "/" + item.dataset.controller + "/IndexJson",
        success: function (result) {
            $("#main-container").html(result);
        },
        error: function (res) {
            console.log("Error:" + res)
        }
    });
}

为什么会这样?有没有办法避免?

nxowjjhe

nxowjjhe1#

问题是,部分视图中的JavaScript每次都在同一个范围内添加和运行,然后因为变量已经存在而抱怨。
为了解决这个问题,你应该将注入的JS Package 在一个IIFE中,这样每个部分视图JS都有自己的作用域。

(function(){
        var area = "@ViewContext.RouteData.Values["area"].ToString()"
    })();

对于大多数JavaScript代码来说,这是一个很好的实践,您可能会编写这些代码以将其保持在全局范围之外。

3ks5zfa0

3ks5zfa02#

如果我每次加载视图时都清空div,那么它就可以工作。

function MenuClickItem(item) {
    $("#main-container").html("");
    $.ajax({
        type: "GET",
        url: item.dataset.area + "/" + item.dataset.controller + "/IndexJson",
        success: function (result) {
            $("#main-container").html(result);
        },
        error: function (res) {
            console.log("Error:" + res)
        }
    });
}

相关问题