mirror of
https://github.com/odoo/owl.git
synced 2025-10-06 19:59:41 +07:00
[REF] blockdom,compiler: implement properties
Before this commit, properties were just handled as a special case of attributes. But it does not make that much sense, since they are different. For example, the `readOnly` property does not have the same name as the `readonly` attribute. The confusion probably comes from the fact that QWeb does not distinguish between property and attributes, so Owl has to infer which one is which. With this commit, we introduce a `block-property` directive in blockdom, and change the compiler to use it in emitted code. It has the additional benefits of slightly shrinking the runtime code, since the `isProp` function can now be located in the compiler.
This commit is contained in:
committed by
Sam Degueldre
parent
f0fb3ab64e
commit
f892929c80
@@ -1,4 +1,3 @@
|
||||
import { isProp } from "../runtime/blockdom/attributes";
|
||||
import {
|
||||
compileExpr,
|
||||
compileExprToArray,
|
||||
@@ -58,6 +57,29 @@ function generateId(prefix: string = "") {
|
||||
return prefix + nextDataIds[prefix];
|
||||
}
|
||||
|
||||
function isProp(tag: string, key: string): boolean {
|
||||
switch (tag) {
|
||||
case "input":
|
||||
return (
|
||||
key === "checked" ||
|
||||
key === "indeterminate" ||
|
||||
key === "value" ||
|
||||
key === "readonly" ||
|
||||
key === "disabled"
|
||||
);
|
||||
case "option":
|
||||
return key === "selected" || key === "disabled";
|
||||
case "textarea":
|
||||
return key === "value" || key === "readonly" || key === "disabled";
|
||||
case "select":
|
||||
return key === "value" || key === "disabled";
|
||||
case "button":
|
||||
case "optgroup":
|
||||
return key === "disabled";
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
// -----------------------------------------------------------------------------
|
||||
// BlockDescription
|
||||
// -----------------------------------------------------------------------------
|
||||
@@ -585,12 +607,15 @@ export class CodeGenerator {
|
||||
} else {
|
||||
expr = `new Boolean(${expr})`;
|
||||
}
|
||||
}
|
||||
const idx = block!.insertData(expr, "attr");
|
||||
if (key === "t-att") {
|
||||
attrs[`block-attributes`] = String(idx);
|
||||
const idx = block!.insertData(expr, "prop");
|
||||
attrs[`block-property-${idx}`] = attrName!;
|
||||
} else {
|
||||
attrs[`block-attribute-${idx}`] = attrName!;
|
||||
const idx = block!.insertData(expr, "attr");
|
||||
if (key === "t-att") {
|
||||
attrs[`block-attributes`] = String(idx);
|
||||
} else {
|
||||
attrs[`block-attribute-${idx}`] = attrName!;
|
||||
}
|
||||
}
|
||||
} else if (this.translatableAttributes.includes(key)) {
|
||||
attrs[key] = this.translateFn(ast.attrs[key]);
|
||||
@@ -640,15 +665,15 @@ export class CodeGenerator {
|
||||
targetExpr = compileExpr(dynamicTgExpr);
|
||||
}
|
||||
}
|
||||
idx = block!.insertData(`${fullExpression} === ${targetExpr}`, "attr");
|
||||
attrs[`block-attribute-${idx}`] = specialInitTargetAttr;
|
||||
idx = block!.insertData(`${fullExpression} === ${targetExpr}`, "prop");
|
||||
attrs[`block-property-${idx}`] = specialInitTargetAttr;
|
||||
} else if (hasDynamicChildren) {
|
||||
const bValueId = generateId("bValue");
|
||||
tModelSelectedExpr = `${bValueId}`;
|
||||
this.define(tModelSelectedExpr, fullExpression);
|
||||
} else {
|
||||
idx = block!.insertData(`${fullExpression}`, "attr");
|
||||
attrs[`block-attribute-${idx}`] = targetAttr;
|
||||
idx = block!.insertData(`${fullExpression}`, "prop");
|
||||
attrs[`block-property-${idx}`] = targetAttr;
|
||||
}
|
||||
this.helpers.add("toNumber");
|
||||
let valueCode = `ev.target.${targetAttr}`;
|
||||
|
||||
Reference in New Issue
Block a user