我要显示的是插槽中没有内容时的文本。
class List extends LitElement {
public render() {
return slot.length === 0
? html`No content is available`
: html`<slot></slot>`;
}
}
答案 0 :(得分:0)
我认为这可能有所帮助:
render() {
return html` <slot id="slot">No content is available</slot>
`;}
firstUpdated(){
const slot = this.shadowRoot.querySelector("#slot");
this.slt = slot.assignedNodes();
if (this.slt.length===0){
console.log('No content is available')
} else {
console.log('Content available', this.slt)
}
}
除非渲染插槽元素,否则无法插槽分配的节点。这就是为什么首先需要渲染它的原因。之后有很多隐藏它的方法。另一种方法是在它的父母处检测它,并将slot元素的nr作为属性传递。