QWeb子模板变量修改不生效？咨询变量作用域及实现方案

问题原因 #

QWeb的t-call指令会为子模板创建独立的局部作用域，默认情况下，子模板中用t-set定义或修改的变量仅在该局部作用域内生效，不会影响父模板（主模板）中的变量。这就是为什么你两次调用子模板时foo始终是2，主模板里的foo还是初始值1。

解决方案 #

有两种常用方法可以实现跨作用域修改变量：

方法1：使用t-set的scope属性指定父作用域

修改子模板中的t-set指令，通过scope="parent"明确将变量修改应用到父作用域：

<template id="my_subtemplate">
    <t t-set="foo" t-value="foo + 1" scope="parent"/>
    <p>Inside subtemplate: <t t-esc="foo"/></p>
</template>

主模板无需修改，此时调用后会得到你预期的结果：

Inside subtemplate: 2
Inside subtemplate: 3
Inside main template: 3

方法2：通过引用类型变量（对象）传递

因为对象是引用类型，子模板中修改对象的属性会同步到父作用域。

主模板中把变量包装成对象：

<t t-set="data" t-value="{'foo': 1}"/>
<t t-call="my_module.my_subtemplate"/>
<t t-call="my_module.my_subtemplate"/>
<p>Inside main template: <t t-esc="data.foo"/></p>

子模板中修改对象的属性：

<template id="my_subtemplate">
    <t t-set="data.foo" t-value="data.foo + 1"/>
    <p>Inside subtemplate: <t t-esc="data.foo"/></p>
</template>

这种方式同样能实现变量的累加效果。

内容的提问来源于stack exchange，提问作者forvas