Функциональность, как $(документ).готов( с Vue.JS
Я написал небольшой код с Laravel, Vue и JQuery, который отлично работает. Теперь я хочу удалить JQuery и запустить все с Vue и Axios.
Вот мой шаблон.:
<ul id="product_list" class="vue-list-wrapper list-wrapper" data-rest="{{ route('rest_get_products', ["id"=>$product_type_id]) }}" data-pagination="0">
<li v-for="item in items">
<div class="item-name item-section">@{{ item.name }}</div>
...bla bla...
</li>
</ul>
Следующий код действительно работает, и я могу визуализировать то, что я получаю от AJAX. Я знаю, как применить Аксиос, без проблем. Дело в том, что я запутался: как я могу гарантировать $(документ).готов (функциональность с Vue ?
(function(){
"use strict";
function init_vue_list(){
var vue_list_handler = new Vue({
el: '.vue-list-wrapper',
data: {
items: []
},
mounted: function (event) {
var self = this;
var ajax_url = this.$el.getAttribute('data-rest');
$.ajax({ // No problem to convert this to Axios.
url: ajax_url,
method: 'GET',
success: function (data) {
self.items = data;
},
error: function (error) {
console.log(error);
}
});
},
methods:{
open_production:function(event){
}
}
});
}
$(document).ready( // I'm confused how I can replace this with Vue.
function(){
if($('.vue-list-wrapper').length > 0) {
init_vue_list();
}
}
);
})(document, $);
У вопроса есть решение - Посмотреть?
Ответы - Функциональность, как $(документ).готов( с Vue.JS / Functionality like $(document).ready( with Vue.js

29.01.2020 12:42:11
Рекомендуемый vue способ сделать это-использовать mounted() .
mounted: function () {
this.$nextTick(function () {
// Code that will run only after the
// entire view has been rendered
})
}
Проверка: https://vuejs.org/v2/api/#mounted
Помочь в развитии проекта: