4

Let assume that I have a lot of html elements need to use MDCMenu. I don't want to init them one by one, so I init all of them with the code below:

html:

<button class="my-menu-toggle" data-toggle="mdc-menu" data-target="#my-menu">Menu Toggle</button>
<div class="mdc-menu" id="my-menu">
</div>

js:

document.querySelectorAll('[data-toggle="mdc-menu"]').forEach(toggleEl => {
      let menuEl = document.querySelector(toggleEl.dataset.target);
      let menu = new MDCMenu(menuEl);

      toggleEl.addEventListener('click', (e) => {
          menu.open = !menu.open;
      });
// maybe I should do this, just wondering that if MDC already do same thing that I haven't figure out.
menuEl.MDCMenu = menu;
        });

then I want to do somethings with one of menu, how can I get the MDCMenu instance of the element?

cloudinstone
  • 99
  • 2
  • 4

0 Answers0