lume / element

Fast and simple custom elements.
https://lume.io
MIT License
117 stars 4 forks source link

add `createEffect` method from the `lume`'s Element3D #11

Open trusktr opened 6 months ago

trusktr commented 6 months ago

this.createEffect() will make an effect that is conveniently stopped in disconnectedCallback. This is useful for creating effects in connectedCallback and then not having to use createRoot and disconnectedCallback to stop them.

Currently:

connectedCallback() {
  super.connectedCallback()

  createRoot(dispose => {
    this.dispose = dispose
    createEffect(() => {
      // ...
      onCleanup(() => {...})
    })
  })
}

disconnectedCallback() {
  super.disconnectedCallback()
  this.dispose()
}

Using this.createEffect:

connectedCallback() {
  super.connectedCallback()

  this.createEffect(() => {
    // ...
    onCleanup(() => {...})
  })
}