python (12.9k questions)

javascript (9.2k questions)

reactjs (4.7k questions)

java (4.2k questions)

java (4.2k questions)

c# (3.5k questions)

c# (3.5k questions)

html (3.3k questions)

Questions - lit

static shadowRootOptions in Litelements with Typescript, set mode to open or close

I'm currently diving into Webcomponents with Litelements: In Webcomponents you can change the way the shadowdom works by defining the mode property as 'open' or 'closed'. Like this in vanilla Javascri...
test-img

Alex

javascript

typescript

web-component

shadow-dom

lit

Votes: 0

Answers: 2

Latest Answer

By default lit element is acting in mode open. So customLitElement.shadowRoot returns a shadow-root. If you want to run it in closed mode set the options as follows: static shadowRootOptions = {...Li...
test-img

Christian

Lit components do not automatically request an update on property change (problem only in my storybook)

This is really odd: I'm using lit in a storybook (using @storybook/html). I do not know why, but in my environment lit does not update the component automatically when a property has been changed. If ...
test-img

Natasha

lit-element

lit-html

lit

Votes: 0

Answers: 2

Latest Answer

I'm unable to edit Natacha response, I have the same issue and the following fixed my issue In tsconfig.json add "useDefineForClassFields": false, in compilerOptions yarn add -D ts-loader@8...
test-img

Vince

commentaryList with commentaryitem not displaying (lit + redux)

Hey i am trying to make an commentary component (looks a bit like a todolist atm). I have my components linked with redux, if i console.log my array(see commentary-list this.commentaries) i see that i...
test-img

Dave Nieberg

javascript

redux

components

lit-element

lit

Votes: 0

Answers: 0

lit: simple button click changing reactive property doesn't cause a re-render

I have super simple lit element and I'm trying to have a closed or open icon based on isOpen reactive property. Clicking on the element sets this.isOpen = !this.isOpen, which should cause an update. U...
test-img

stackcen

javascript

typescript

web-component

lit

Votes: 0

Answers: 1

Latest Answer

Apparantly reactive properties are only reactive if it is part of the DOM Element API. You can turn this off by setting ({attribute: false}) and it will re-render.
test-img

stackcen

Posts

Questions

Blogs

Jobs