Инициализация элементов материализации в Vue.js

Question

Как инициализировать элементы выбора или модальности Materializes в Vue.js? Когда я добавляю следующий код в мой документ, готовые элементы не работают.

<script> 
 

 
$(document).ready(function() { 
 
    $('.modal-trigger').leanModal('open'); 
 
    $('select').material_select(); 
 
}); 
 

 
//Vue.js code here... 
 
    
 
</script>

Answer 1

Вы могли бы попытаться назвать этот код в одном из Vue в lifecycle hooks (см this diagram, чтобы выяснить, где именно они выполняются), вы, вероятно, хотите использовать mounted.

Но имейте в виду, что это не пуленепробиваемое решение. Vue может манипулировать DOM по-разному позже и как таковая не обязательно совместима с Materialize. Лучшим решением в этих случаях всегда является поиск реализации конкретных компонентов, которые вы пытаетесь использовать, например. Vue Material.