在react中使用swiper插件

$npm install swiper

安装成功之后引入swiper

import Swiper from 'swiper/dist/js/swiper.js'
import 'swiper/dist/css/swiper.min.css'

这里引入主要是为了后期打包（build）的时候不报错

componentDidMount(){
    var mySwiper = new Swiper('.swiper-container', {
       slidesPerView : 3,
       spaceBetween : 20,
    })
}

引入之后我们在didmount里实例化swiper

    

        

            {
                this.state.bag.map((item,index)=>{   // this.state.bag是在state里面定义的数组为了循环数据
                    return(                                    
                        
this.getcommodity(index)} className=                            
                        {this.state.classId == index?this.state.arr.join(' '):"swiper-slide"}>
                        

                        

                        
                        
{item.title}
                        
                        
                    )
                })
            }
    

之后就可以再render()里面写我们的html代码

 end：

          可能会存在很多bug，但是没有什么bug是用原生解决不了的

javascript   is very good！