Vue的项目使用Element ui 走马灯 不能实现的问题
2018-03-27 18:16
2156 查看
1.在vue项目中引入element ui http://element.eleme.io/#/zh-CN/component/carousel
引入后,HTML部分
<el-carousel height="150px"> <el-carousel-item v-for="item in imgList" :key="item" height="300px" > <h3><img :src="item" alt=""> </h3> </el-carousel-item> </el-carousel>
JS部分
<script>export default { data(){ return { imgList:[ require('../../assets/img/images/a1.png'), require('../../assets/img/images/a2.png'), require('../../assets/img/images/a3.png'), require('../../assets/img/images/a4.png'), require('../../assets/img/images/a5.png') ] } }, components: { }}</script>
用webpack搭建的项目不能直接使用绝对路径,要用require,如果不适用这个,必须是线上图片。http类型的
引入后,HTML部分
<el-carousel height="150px"> <el-carousel-item v-for="item in imgList" :key="item" height="300px" > <h3><img :src="item" alt=""> </h3> </el-carousel-item> </el-carousel>
JS部分
<script>export default { data(){ return { imgList:[ require('../../assets/img/images/a1.png'), require('../../assets/img/images/a2.png'), require('../../assets/img/images/a3.png'), require('../../assets/img/images/a4.png'), require('../../assets/img/images/a5.png') ] } }, components: { }}</script>
用webpack搭建的项目不能直接使用绝对路径,要用require,如果不适用这个,必须是线上图片。http类型的
相关文章推荐
- vue+elementUI中使用 el-autocomplete 实现远程搜索的下拉框需要注意的问题
- 在vue项目中使用element-ui的Upload上传组件的示例
- 浅谈使用element ui + vuedraggable + sortablejs实现多种版式布局及托拽(2)
- vue2.0 使用element-ui里的upload组件实现图片预览效果
- vue2.0 使用element-ui里的upload组件实现多图上传。采用FORMDATA的方式上传。
- 使用ES6+vue+elementui+webpack搭建简单项目
- 使用Vue与ElementUI开发时,关于时间控件的问题
- 使用Element-ui的Table时表格不能显示问题
- swipe.js工具包实现手机web滑动轮播效果存在jQuery对象不能使用问题并解决(个人项目经验)
- Vue、Element-ui项目中如何使用Iconfont(阿里图标库)
- 使用ES6+vue+elementui+webpack搭建简单项目
- 浅谈使用element ui + vuedraggable + sortablejs实现多种版式布局及托拽(1)
- 使用 vue-cli + element-ui 快速搭建项目
- 在vue项目中使用element-ui的Upload上传组件
- 【PC端vue ui框架学习】vue项目如何使用基于vue的UI框架Element
- vue2.0 使用element-ui里的upload组件实现图片预览效果方法
- vue项目中vue-i18n和element-ui国际化开发实现过程
- 解决Vue使用mint-ui loadmore实现上拉加载与下拉刷新出现一个页面使用多个上拉加载后冲突问题
- 使用Reveal.app调试整个项目UI时间,增加LD指令 -Objc引起项目中多个静态库冲突问题
- eclipse使用可能出现的问题(1.工作空间2.tomcat删除不能重建3导入项目报错)