1

How does lifecycle methods work in hyperapp v2? Why don't I see 'hello' in my console?

import { h, app } from "hyperapp";

app({
    init: { name: 'world' },
    view: ({ name }) => h('div', {
        onCreate: () => console.log('hello')
    }, `hello ${name}!!!`),
    node: document.getElementById("app")
});
Tahin Rahman
  • 1,154
  • 1
  • 11
  • 20

1 Answers1

2

Lifecycle events are no longer a feature of hyperapp, as of v2, sorry. There was a lot of debate over this in the community, and they were not discarded lightly. But discarded they were.

It is possible to add them back yourself (by overriding the appendChild et c methods either in the vdom or on the Element.prototype) - but before trying that route, consider what you need them for. Most cases people were using lifecycle events for, there have been more robust solutions proposed by the community.

Zach
  • 85
  • 7
  • Then how are we supposed to fetch data or do any task at the creation time of any component? Not at the creation time of the app. Providing a sample code or pointing to an example would be useful. – Tahin Rahman Mar 10 '20 at 03:20
  • Performing tasks in reaction to DOM being created is not a part of Hyperapp's architecture. It's not how problems are solved. Hyperapp's design is based around state machines. The state, and actions which transform the state determine what effects are produced (like data fetching) AND what the DOM should look like. The DOM is simply a visualization of the state. Nothing more. – Zach Mar 10 '20 at 09:11
  • This article I wrote on Medium does a decent (I think) job of explaining both the how and why of Hyperapp (v2). [https://medium.com/hyperapp/a-walk-through-hyperapp-2-b1f642fca172](https://medium.com/hyperapp/a-walk-through-hyperapp-2-b1f642fca172) – Zach Mar 10 '20 at 09:15
  • If you have any questions about solving specific problems with this architecture, feel free to ask! Here or join the [hyperapp slack](https://hyperappjs.herokuapp.com/) – Zach Mar 10 '20 at 09:17