Search code examples
ecmascript-6ractivejs

ES6 Class, extending Ractive

I'm using ES6 (via Babel), and looking for the "proper" way to define a Class that extends Ractive (without calling Ractive.extend(...) if possible), since Ractive allows new (http://docs.ractivejs.org/latest/new-ractive).

Tried the following approach, which almost seems to work:

class Home extends Ractive {
  constructor() {
    super();
    this.template = "<h1>{{message}}</h1>";
  }

  data() {
    return {
      message: 'This is sample data'
    }
  }

  oninit() {
    console.log('ok');
  }
}

Ractive instance is initialized without error, and oninit is called, however the template seems undefined.

Solution

  • I would like to start using that syntax as well. :)

    But I spent an hour a month ago trying to see if it was hackable, but concluded it's not currently possible due to how some of the component extension works. But it's on our radar and should land in a near-future version.