Swiper使用时pc端有轮播，mobile无轮播，或mobile有轮播，PC无轮播的自适应写法。

背景：
在日常双端开发时，有时候会遇到比较特殊的轮播需求，比如标题中所写的那种形式，只适应一个单端的轮播图，另一个端要不破环样式。当我们正常使用swiper轮播的时候，使用浏览器自带的调试工具时，每次来回切换就会破环界面的ui，所以刷新就可以解决，对于我这种强迫症患者来说，不是那么舒适，在网上搜了很多方法，并不能完美的解决。

错误写法：
本来我的想法是，在pc的时候init，在mobile进行destroy，但是我发现这样进行操作的时候还是会有问题，在来回切换的时候样式去不掉，会错乱。

错误写法-方式1：

        var newSwiper = new Swiper('.swiper-container', {
            loop: true,
            slidesPerView: 1,
            speed: 500
        });

        $(window).resize(function () {

            if ($(window).width() < 768) {
                newSwiper.init();
            } else {
                newSwiper.destroy()
            }

        })

错误写法-方式2：
在前端我发现当mobile应用的时候，转变为pc的时候，差别仅仅只是因为在warp 和 slider 上面多了 style的样式，如果手动去掉的话，样式就可以恢复正常。
因此使用了这样的写法，但是并没有起到作用，后来发现其实是有作用的，只不过轮播图的销毁速度是在移除style之后的，所以，即使使用这种写法也无法起作用。

        function initSwiper() {
            var screenWidth = $(window).width();
            if (screenWidth < 768) {
                var newSwiper = new Swiper('.swiper-container', {
                    loop: true,
                    slidesPerView: 1,
                    speed: 500
                });
            } else if (screenWidth > 768) {
                newSwiper.destroy();
                $(".swiper-wrapper").removeAttr("style");
                $(".swiper-slide").removeAttr("style");
            }
        }
        initSwiper();

        $(window).resize(function () {
            initSwiper();
        })

正确写法：
在生成swiper对象的时候给它赋一个值，这样在每次销毁后，再赋值，这样就可以完全销毁掉，且不影响移除style这个js的先手顺序，就可以完美的解决了，写法如下。

        var newSwiper = undefined;
        function initSwiper() {
            var screenWidth = $(window).width();
            if (screenWidth < 768 && newSwiper == undefined) {
                newSwiper = new Swiper('.swiper-container', {
                    loop: true,
                    slidesPerView: 1,
                    speed: 500
                });
            } else if (screenWidth > 768 && newSwiper != undefined) {
                newSwiper.destroy();
                newSwiper = undefined;
                $(".swiper-wrapper").removeAttr("style");
                $(".swiper-slide").removeAttr("style");
            }
        }
        initSwiper();

总结：
在日常开发的时候会遇到各种奇奇怪怪的需求，可能在使用某些插件的时候，并不能完全符合你想要的前端效果，要进行二次开发，这就需要我们细心发现，认真归纳方法，这样才可以解决问题。