mirror of
https://github.com/odoo/owl.git
synced 2025-10-06 19:59:41 +07:00
[IMP] component: better detection for dynamic component change
Before this commit, Owl could not detect that the underlying component
in a template such as <t t-component="{{state.child}}"/> was changing,
if the two components have the same tag as root element.
This is because the reconciliation is done at the vdom level, which does
not know about components. To solve this, one could use a t-key to make
sure owl can make the difference.
With this commit, we can simply use our knowledge of the fact that we are
dealing with a dynamic component and autogenerate a suitable key.
closes #623
This commit is contained in:
@@ -245,7 +245,18 @@ QWeb.addDirective({
|
||||
.join(",");
|
||||
let componentID = ctx.generateID();
|
||||
|
||||
const templateKey = ctx.generateTemplateKey();
|
||||
let hasDefinedKey = false;
|
||||
let templateKey;
|
||||
if (node.tagName === "t" && !node.hasAttribute("t-key") && value.match(INTERP_REGEXP)) {
|
||||
defineComponentKey();
|
||||
const id = ctx.generateID();
|
||||
// the ___ is to make sure we have no possible conflict with normal
|
||||
// template keys
|
||||
ctx.addLine(`let k${id} = '___' + componentKey${componentID}`);
|
||||
templateKey = `k${id}`;
|
||||
} else {
|
||||
templateKey = ctx.generateTemplateKey();
|
||||
}
|
||||
let ref = node.getAttribute("t-ref");
|
||||
let refExpr = "";
|
||||
let refKey: string = "";
|
||||
@@ -378,9 +389,15 @@ QWeb.addDirective({
|
||||
ctx.addElse();
|
||||
|
||||
// new component
|
||||
function defineComponentKey() {
|
||||
if (!hasDefinedKey) {
|
||||
const interpValue = ctx.interpolate(value);
|
||||
ctx.addLine(`let componentKey${componentID} = ${interpValue};`);
|
||||
hasDefinedKey = true;
|
||||
}
|
||||
}
|
||||
defineComponentKey();
|
||||
const contextualValue = value.match(INTERP_REGEXP) ? "false" : ctx.formatExpression(value);
|
||||
const interpValue = ctx.interpolate(value);
|
||||
ctx.addLine(`let componentKey${componentID} = ${interpValue};`);
|
||||
ctx.addLine(
|
||||
`let W${componentID} = ${contextualValue} || context.constructor.components[componentKey${componentID}] || QWeb.components[componentKey${componentID}];`
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user