Как массово инициализировать dropdown в vue?

Question

[Max9999]

Здравствуйте.
vue + materializecss. Я в цикле вывожу блоки с dropdown.

<a class=""  href="#" :ref="'dropdown' + post.index" v-bind:data-target="'dropdown' + post.index" > <i class="material-icons">visibility</i></a>
    <ul v-bind:id="'dropdown' + post.index"  class="dropdown-content">
        <li>...</li>
    </ul>

Нужно их всех проинициализировать

mounted() {
   M.Dropdown.init( this.$refs.dropdow?, {
    hover: true
  })
 },

Как сделать?

Answer 1

[Aetae]

Тупой вариант: как в циклом выводите, так в цикле инициализируйте(при v-for в this.$refs.dropdow лежит массив).
Правильный вариант: сделать отдельный компонент m-dropdown, который внутри проводит всю нужную инициализацию и расставляет нужную вёрстку, после чего подключать циклом именно этот компонент.
Идеальный вариант: использовать либы написанные на vue, дабы избежать лишнего оверхеда.

Answer 2

[Виктор]

я думаю есть еще вариант использовать директивы