所以，我嘗試讓 2 個組件（一個導航欄和一個自定義選單）相互通信，知道選單不是導航的子級。在導航內部，我有一個漢堡按鈕，當我按下它時，我想顯示選單，但我找不到在導航組件中觸發信號的方法，以便選單可以到達它并根據它更改它的樣式到那個“信號”。我能做到的唯一方法是將選單放在導航組件中并在那里使用它，但我想讓它獨立。任何想法我怎么能做到這一點？如何使用 Lit 使 2 個獨立的組件進行通信？
uj5u.com熱心網友回復：
最好的方法是使用 CustomEvents。您需要在漢堡包@click方法中的 window 元素上分派事件，如下所示：
<my-hamburger
@click="${() => {
window.dispatchEvent(new CustomEvent('hamburger-clicked'));
}">
</my-hamburger>
你當然需要在自定義選單中監聽這個事件，你可以使用connectedCallback方法來做到這一點，就像這樣：
connectedCallback() {
super.connectedCallback();
window.addEventListener('hamburger-clicked', this.showMenu); // here you need to pass the function responsible for showing menu
}
disconnectedCallback() {
window.removeEventListener('hamburger-clicked', this.showMenu);
super.disconnectedCallback();
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/359815.html
標籤：javascript 点亮元素