Question

我不知道是否允许这样做，但是我有一个分为两部分的问题。如何将swiper.js和swiper.min.css与Laravel集成在一起？我正在使用Laravel Mix来编译JS和SASS文件。我的第二个问题是，如何在Laravel中调用“ onClick”事件函数？我正在使用Laravel 7.3.1。

app.js

var swiper = new Swiper('.swiper-container', {
    effect: 'coverflow',
    grabCursor: 'true',
    centeredSlides: 'true',
    slidesPerView: 'auto',
    coverflowEffect: {
        rotate: 50,
        stretch: 0,
        depth: 100,
        modifier: 1,
        slideShadows: true,
    },
    pagination: {
        el: '.swiper-pagination',
    },
});

刀片

{{ asset('public/js/app.js') }}
{{ asset('public/css/swiper.min.css' )}}

对于问题的第二部分–我想在Blade /视图中调用以下函数。

function close() {
    document.getElementByClassName("media-icons").style.width = "0";
    document.getElementByID("hide-icon-panel").style.display = "none";
    document.getElementByID("show-icon-panel").style.display = "inline-block";
}

通过以下方式将其包含在Blade中：

<button id="hide-icons" onclick="w3_close();"><i class="left"></i>. 
</button>

我尝试了以上所有方法，但似乎没有任何效果。请帮助，您的帮助将非常有帮助。

Answer 1

import Swiper from './swiper.min.js'
const swiper = new Swiper(...)

如何使用Laravel Mix集成Swiper和Laravel

1 个答案: