swiper在移动端中的应用

**

1、vue swiper回调函数内传值到vue数据内

**

vue swiper回调函数内传值到vue数据，不能直接用this，因为this指向的是当前swiper，所以需要在data内 定义self指向this
如下：

data() {
	let self = this
	return {
		currentIndex: 0,
		swiperOption:{
	        on: {
	          slideChangeTransitionEnd: function(){ // swiper从一个slide过渡到另一个slide结束时执行
	            self.currentIndex= sthis.activeIndex // 获取当前index的回调函数
	            self.getData() // 执行函数getData()
	          },
	        },
		}
	}
}

**

2、swiper不兼容ios11以下的版本手机；会导致Vue整个项目白屏

**

两个地方兼容修改：
1> build —— webpack.prod.conf.js新增mangle的选项

new UglifyJsPlugin({  
  uglifyOptions: {
    compress: {
      warnings: false
    },
    // 解决ios10手机打开空白问题
    mangle: {
      safari10: true   
    }
  },
  sourceMap: config.build.productionSourceMap,
  parallel: true
}),

2> build —— webpack.base.conf.js新增mangle的选项

{
  test: /\.js$/,
  loader: 'babel-loader',
  include: [
    resolve('src'), 
    resolve('test'), 
    resolve('node_modules/webpack-dev-server/client'),
 
    // 解决ios10手机打开空白问题
    resolve('node_modules/swiper'),
    resolve('node_modules/dom7'),
    resolve('node_modules/ssr-window'),
   ]
},

**

3、低版本安卓机不兼容，，页面白屏

**

问题 （es6 及 swiper ）

解决方案待定，还没有完美解决；请知道的小伙伴留言指教