Trying to do something like this:
.active{
background-image:url("'+this.imgURL+'")
}
I need to prefil an image url from a static resource on load on a html element with a specific "active" class and not on the rest of them.
<lightning-button-menu class="slds-p-left_small slds-p-top_large" name={col.typeAttributes.columnFilterFieldName} style="position: absolute;"
alternative-text="Show menu" variant="container" icon-name="utility:threedots_vertical" onselect={handleTextFilterOptions}>
<lightning-menu-item value="contains" label="Contains" class="active"
data-name={col.typeAttributes.columnFilterFieldName} onclick={handleClickMenuItem}></lightning-menu-item>
<lightning-menu-item value="begins" label="Begins with"
data-name={col.typeAttributes.columnFilterFieldName} onclick={handleClickMenuItem}></lightning-menu-item>
<lightning-menu-item value="clear" label="Clear filters" icon-name="utility:record_delete"
data-name={col.typeAttributes.columnFilterFieldName}></lightning-menu-item>
</lightning-button-menu>
tried both:
connectedCallback(){
this.template.querySelector('.active').style = 'background-image:url("'+this.checkImg+'");padding-left: 10px;' ;
}
renderedCallback(){
this.template.querySelector('.active').style = 'background-image:url("'+this.checkImg+'");padding-left: 10px;' ;
}
This logic works on click but I want to preload it into the css or on load.