Question

我在.cshtml文件（部分视图）中嵌入的脚本片段中经常使用这种“ Javascript名称空间”模式：

<script type="text/javascript">
    (function (MyNamespace) {
        MyNamespace.PublicFunc1 = function (p1, p2) {
            localFunc1('abc');
            MyNamespace.PublicFunc2(p1, p2, 'abc');
        }

        MyNamespace.PublicFunc2 = function (p1, p2, p3) {
            // ...
        }

        localFunc1(p1) {
            // ...
        }
    }(window.MyNamespace = window.MyNamespace || {}));
</script>

它的工作原理就像一种魅力，我可以从该脚本片段的外部调用这些MyNamespace.PublicFunc1和MyNamespace.PublicFunc2函数。

当需要同时渲染其中两个或多个局部视图时，就会出现问题，因此，任何对外部外部JS代码的调用，例如MyNamespace.PublicFunc1都将无法执行，因为将是该功能的两个或更多实例。

为解决这个问题，我尝试通过Razor语法为这些脚本使用服务器端唯一的名称空间ID /名称：

@{
    // server-side variable with a unique namespace identifier/name
    string _namespace = Model.MyUniqueNamespace;
}

<script type="text/javascript">
    (function (@_namespace) {
        @_namespace.PublicFunc1 = function (p1, p2) {
            @_namespace.PublicFunc2(p1, p2, 'abc');
        }

        @_namespace.PublicFunc2 = function (p1, p2, p3) {
            // ...
        }

        localFunc1(p1) {
          // ...
        }
    }(window.@_namespace = window.@_namespace || {}));
</script>

这种方法的问题在于，整个@_namespace.PublicFunc1部分都由Razor和服务器端处理-这很有意义，但不是我所需要的；我只需要将@_namespace部分作为服务器端，并将其周围的所有其他部分作为客户端/ JS。

我的问题是：

有没有办法使用Razor语法解决这个问题？
是否有另一种/更好的方式（通过Javascript魔术）来处理这些情况，而不必编写完整的JS插件/小部件/库（对于每个这样的本地化/特定于页面的脚本片段来说似乎太多了）？

Answer 1

将其更改为@(_namespace)应该可以解决问题1。对于问题2，请务必注意，传递给函数的变量名并不……真的……很重要。即：

(function(foo) {
  foo.func1 = function() { ... }
})(window.bar = window.bar || {});

这仍将设置window.bar.func1。

使用Razor语法的Javascript名称空间？

1 个答案: