gem 的问题


同样具有 OOP 的问题:https://zhuanlan.zhihu.com/p/46207044
  • 基类方法被覆盖
  • 基类,子类方法调用凌乱
同一功能的代码写在不同的地方(生命周期中)

lit-html 语法复杂:if 块、list

component bind(this) 需要时刻注意

gem 元素内不要直接修改公开的 attr/prop,但是 constructor 里面可以这么做,当然 css state 不是公开的 attr/prop,也可以直接修改。

// gem 初始化 history 的 replace 将导致 electron webContents 崩溃

DOM 有 attr 和 prop 之分,attr 表示语义,prop 表示 js 对象,DOM 的有些 attr 和 prop 是同步的,有些不是
// string 类型的属性尽量用 attr,非 string 使用 prop

为了统一开发体验,最佳实践是所有 attr 能像 prop 一样访问和设置。在 gem 中是在 construct 中读取 observedAttributes 列表定义成访问器属性来实现的。问题
  • 并不是所有 attr 都能直接读取, 没有 observedAttributes 的 attr 只能 get/setAttribute
  • attr 和 prop 名字重叠
  • attr 要支持 lit-plugin 需要再写一份标记注释
  • observed* 似乎有些多余, 没有写在 observedAttributes 中时直接访问得到的是 prop,且难以排查
解决方案:使用 ts 装饰器。新问题
  • 有些装饰器字段有默认值,但是 prop 装饰器没有 // 因为类型不确定

问题:observedAttributes 时在 render 中 setAttribute 导致无限循环

问题:attr 没有 boolean 类型 // getAttribute 只能返回字符串

问题ts 中用字段来标记的 attr 也会被当成 prop // lit-plugin 不知是否可以修复

问题在 js 中不能通过字段写事件监听器,ts 由于有编译所以可以 // 本来就不推荐使用 prop 来设置事件监听器
解决方案:在生命周期函数中定义事件监听器 // addEventListener

问题:内置方法不允许覆盖,一旦覆盖可能不会正常工作