时间戳

首页 > 解决方案 > Ajax 调用 Laravel Mix 后 Vue 组件未重新渲染

ajax - Ajax 调用 Laravel Mix 后 Vue 组件未重新渲染

问题描述

我有一个使用 AJAX 检索数据的酒店网站。数据使用卡片视图显示。卡片的某些部分正在使用 Vue 组件（收藏按钮和货币选择）。

卡片视图

因此，在第一次加载时，所有酒店卡都正确加载（包括收藏夹和货币选择）。然后在第二次滚动之后，加载收藏夹和货币选择选项，但不会重新渲染。

收藏按钮不显示

检查元素上的收藏按钮

我在用着 ：

$('ul.pagination').hide();
        $(function() {
            $('.scrolling-pagination').jscroll({
                autoTrigger: true,
                padding: 0,
                nextSelector: '.pagination li.active + li a',
                contentSelector: 'div.scrolling-pagination',
                loadingHtml: '',
                callback: function() {
                    $('ul.pagination').remove();
                }
            });
        });

    <script src="{{ mix('js/guest-app.min.js') }}" charset="utf-8"></script>

<ul>
    <li><a href="#" data-toggle="modal" data-target="#map-area" class="property-map-icon"><i class="fa fa-map-o fa-lg" aria-hidden="true"></i></a></li>
    <li><a href="#" class="email-btn property-email property-email-contact-agent" id="property-email-contact-agent-{{ $slugPropertyId }}"></i></a></li>
    <li><fav-button
        property-id="{{ $property->property_id }}"
        slug-property-id="{{ $slugPropertyId }}"
        @add="addFav"
        @remove="removeFav"
    ></fav-button></li>
</ul>

标签： ajaxlaravelvue.jslaravel-mix

解决方案

推荐阅读