Using with LitElement

[chisholmd]

trafficstars

First thank you so much for this article and code. Such a nice break from untangling all the yarn and ts and other toolchain confusion.

I am still learning a lot of this stuff and I am trying to adapt this code for use with my app that is using LitElement.

Your sample code uses a new base class called component, and I was wondering what you would advise? Should I create myNewBaseClass that extends LitElements and include your constructor code? or is there a better approach? Thanks for any pointers

[Andy-set-studio]

I'm not 100% up to scratch with Lit stuff. Can you give me a sample of your code please?

[chisholmd]

I figured it out, I had a little typo. Basically when using Lit-Element all your classes are extending LitElement. Just like your sample uses 'component' My instincts seemed to be correct as I just created a new class with your constructors that extended LitElement, and then all my elements extend this new class.

export class MiadminBaseclass extends LitElement {
	constructor(props = {}){
        super();
        let self = this;
       and the rest of the vanilla store code

And then my apps elements extend that.
class MiadminApp extends (MiadminBaseclass) {

[Andy-set-studio]

Glad to hear you sorted it!

[chisholmd]

Working like a charm, and I have to thank you again for providing this walk through uncluttered by a dozen different tools. The ecosystem around some of this stuff is all to often turning "reusable" into "unusable".

[Andy-set-studio]

Hell yeh. That's exactly why I wrote it :)

[madeInLagny]

Hi, Thanks for the great repo. I am also using lit-Element. Can we push the litElement logic to creating a webcomponent with this state-management model ? I am thinking that it may be more convenient to use than extending a class. What do you think ?