Observe

Omi Observe

你可以为那些不需要 store 的自定义元素使用 observe 创建响应式视图，比如:

define("my-app", class extends WeElement {
  static observe = true
  install() {
    this.data.name = "omi"
  }
  onClick = () => {
    this.data.name = "Omi V4.0"
  }
  render(props, data) {
    return (
      <div onClick={this.onClick}>
        <h1>Welcome to {data.name}</h1>
      </div>
    )
  }
})

如果你想要兼容 IE11,请使用 omi-mobx 代替 omi 自带的 obersve，往下看..

Omi Mobx

import { tag, WeElement } from "omi"
import { observe } from "omi-mobx"
@observe
@tag("my-app")
class MyApp extends WeElement {
  install() {
    this.data.name = "omi"
  }
  onClick = () => {
    this.data.name = "Omi V4.0"
  }
  render(props, data) {
    return (
      <div onClick={this.onClick}>
        <h1>Welcome to {data.name}</h1>
      </div>
    )
  }
}