Extending a Riot.Element with templates

[andrewvarga]

Hi Nino,

this is not a bug, more like a question and it's probably related to riot more than riotTS.

I'm wondering if it's possible that if I have a class which has a template to extend that class but be able to use the parent's template too. The closest I could get to this was to use composition instead of inheritance and <yield/>.

So something like this:

@template(`
   <mycomp>
      <p>mycomp content</p> 
      <yield/>
   </mycomp>
)
class MyComponent extends Riot.Element
{
    // ....
}

// This kinda does what I need (except that MyChild doesn't inherit from MyComp):
`@template(`
   <mychild>
      <mycomp>test</mycomp>
   </mychild>
)
class MyChild extends Riot.Element
{
    // ...
}

// This doesn't work, the template override MyComponent's template and I couldn't find a way to be able to use the parent's template
`@template(`
   <mychild>
      <div>test</div>
   </mychild>
)
class MyChild extends MyComponent
{
    // ...
 }

Or maybe I'm using a wrong approach and I shouldn't even try to do this?

[nippur72]

Yes @template is overridden because this is how classes are supposed to work. But perhaps in your case you just need to have a 3rd element which is a common ancestor for MyComp and MyChild, e.g.

class MyCommonBase extends Riot.Element { /*...*/ }
class MyComponent extends MyCommonBase { /*...*/ } 
class MyChild extends MyCommonBase { /*...*/ } 

(not sure what you want to achieve though)

[andrewvarga]

Thank you that sounds reasonable. I just wanted to reuse the template of my parent class without having to rewrite it, but I will try to explain my use case better.

[sidouglas]

I'll be interested to hear back from @andrewvarga to see if this is working as intended. This relates to issue 40