Материализация CSS Модал не работает с Vue - PullRequest
0 голосов
/ 14 февраля 2019

Я пытаюсь использовать материализованный модал в Vue ..

Я импортировал его в main.js

import 'materialize-css'
import 'materialize-css/dist/css/materialize.css'
import 'materialize-css/dist/js/materialize.js'

File.vue

<a class="fa fa-trash modal-trigger" href="#delete" @click="consolel(index)"></a>

        <div id="delete" class="modal" ref="deleteModal">
          <div class="modal-content">
            <h4>Modal Header</h4>
            <p>A bunch of text</p>
          </div>
          <div class="modal-footer">
            <a
              href="#!"
              class="modal-close waves-effect waves-green btn-flat"
              @click="deleteItem(index)"
            >Agree</a>
          </div>
        </div>

mounted(){
     M.AutoInit();
}

Я попробовал способ, документы попросили вызвать модальный

document.addEventListener('DOMContentLoaded', function() {
var elems = document.querySelectorAll('.modal');
var instances = M.Modal.init(elems, options);
});

В установлен .Но это не сработало.

Как вызвать модал в Vue?!

1 Ответ

0 голосов
/ 14 февраля 2019

Другой способ сделать это - просто передать массив vue references и извлечь базовый узел из VNode.

M.Modal.init([this.$refs['deleteModal'][0]], null)
...