HTML Global Attributes — JavaScript Property Mapping

好，我们来看这一页，讲的是HTML全局属性在LWC里的特殊情况。 你可能知道，像 `class`、`title`、`accesskey` 这些属性，几乎所有HTML元素都能用。在LWC里，我们通常不直接把它们暴露出去，而是用组件自己定义的特定属性，这样做更安全、更符合组件化的思想。但有时候，你可能真的需要去操作这些全局属性，那该怎么办呢？ 这时候，你就得用 `@api` 装饰器来标记那个属性。因为只有这样，外部才能给这个组件设置这些HTML级的属性。但要注意，有一个坑：这些属性名从HTML转换成JavaScript的时候，并不全是我们熟悉的驼峰规则。 举个例子，HTML里的 `for` 属性，在JavaScript里不能叫 `for`，因为 `for` 是保留关键字，所以它变成了 `htmlFor`。再比如 `maxlength`，按驼峰本应该是 `maxLength`，那它确实就是这样；但有时候容易弄混，所以记住它确实是 `maxLength`。还有 `readonly`，转换过来是 `readOnly`，首字母小写，中间O大写。 所以，当你在LWC里写 setter 或 getter 来捕获这类属性时，一定要用这些非标准的名字。这页幻灯片里提供了一个明确的映射表，如果你记不住，就随时查这个表，千万别自己想当然地去转换。 总之，记住两件事： 第一，LWC里首选组件专属属性，尽量别去碰HTML全局属性。 第二，如果必须用，就用 `@api` 暴露，并且严格按照这个映射表来命名，比如 `htmlFor`、`maxLength`、`readOnly`。 这样就不会因为名字写错而 debug 半天啦。