JsViews：使用深拷贝对象重新初始化模板：~root 问题

Question

我正在尝试使用数据 linked 对象的深层副本创建撤消过程（重新初始化模板）。这可能不是理想的方法，但我现在无法使用视图模型、merge() 和 unmap()。

mainObject 呈现 templateA（mainObject 派生自 AJAX 请求，类型：json）

mainObject = $.extend(true, mainObject, addObject)；添加其他对象用于编辑目的，呈现模板 B（addObject 派生自 AJAX 请求，类型：json）

我使用上述两个模板和对象已经有一段时间了，没有出现任何问题。

现在...

我想在用户取消编辑（双向数据-linked）的情况下对 mainObject 进行深度 copy/clone。

当我创建 mainObjectClone = JSON.parse(JSON.stringify(mainObject)) 并使用相同的模板 templateB 重新渲染时，我收到与上下文 ~root.

相关的错误

据我了解，JSON.parse() returns 与 AJAX 请求的对象类型相同，类型：json。

对象未返回或出现如下错误：Uncaught TypeError: Cannot read property '0' of undefined。 +((v=view.ctxPrm("root").myPhotos[j._sq(0)])!=null?v:"")

启用调试后，除了使用 ~root 的地方外，模板的所有部分都可以正常渲染。

奇怪的是，~root 在我在模板中定义它的地方不起作用...但在进一步测试中，如果我将 ~root 添加到 'different' 顶部关卡对象（一个不需要上下文的对象），它在那里工作很奇怪。

我试过这些，但都在 ~root:

上中断了

myObjectClone = $.extend(true, {}, mainObject)
Lodash 深拷贝
同时将对象顺序 mainObject, addObject 反转为 mainObject = $.extend(true, addObject, mainObject) 也会中断 ~root 访问（第一个对象被扩展）。

我已尝试在 jsfiddle 中重现该问题，但未能重现...尽管有限 data/template。

控制台日志显示所有对象的格式都正确。

~root 如何在某些或所有对象上获得 created/initialized...？

哪些代码冲突可能会改变 ~root 上下文？

如有任何提示或指点，我们将不胜感激。

更新

虽然我已经将所有助手等注释掉到准系统模板 + 数据（启用调试）...但 ~root 问题仍然存在。这 'finally' 让我相信这与模板或数据无关。

这是我的场景：

TemplateA 使用 link() 和 DataA 呈现（没有问题）
TemplateB 使用 link() 和深度 copy/clone 对象 (DataA + DataB) 呈现（~根本问题）
模板 A 和 B 共享共同的双向数据-linked 项目，尽管来自不同的数据源。

如果我将 TemplateA 渲染方法更改为 render()（而不是 link()）；然后渲染 TemplateB，~root context works.

另一种情况：不是使用深度 copy/clone 对象 (DataA + DataB) 渲染 TemplateB...我将服务器上的数据组合起来并根据它进行渲染。这也产生了 ~root 上下文问题。

然后我想当从多个模板调用 link() 时可能会出现问题，它们的同名对象会发生冲突。所以我隔离了一个常见的对象，将其重命名并渲染了一个名称更改的测试模板....~root 问题仍然存在。

目前我只知道这些 ;-)

Answer 1

在这里回答我自己的问题...

这里的 JsViews 没有问题...~root 的问题是我自己造成的;-)

问题是由于将 link() templateB 注入 link() templateA...从而与 ~root 产生冲突。

我的数据源和模板曾经是合并的...我把它们分开进行测试，但没有想清楚。

基本上我是这样做的：

<script id="templateA" type="text/x-jsrender">
    <div id="userView">...</div>
    <div id="editView"></div>
</script>

<script id="templateB" type="text/x-jsrender">
    ...
</script>


$.templates("#templateA").link("#userView", dataA)

onClick openEditView...

$.templates("#templateB").link("#editView", $.extend(true, dataA, dataB))

修复非常简单，如下所示：

<script id="templateA" type="text/x-jsrender">
    <div id="userView">...</div>
    {{if editable}}
         {{include tmpl="templateB" /}}
    {{/if}}
</script>

<script id="templateB" type="text/x-jsrender">
    ...
</script>


$.templates("#templateA").link("#userView", dataA)

onClick openEditView...

$.extend(true, dataA, dataB))

这解决了 ~root 问题，并且深层复制对象方法现在也可以使用。

JsViews：使用深拷贝对象重新初始化模板：~root 问题

JsViews: Reinitialize Template Using Deep Copy Object: ~root issue

jsrender

jsviews