# gg-banner 幻灯片
gg-banner
普通幻灯片,可自定义图片大小和内容等,默认为透明背景。
在 script
中引用组件 ,
若使用uni-app的
easycom
引入方式,则无需在script
中重复引用
import ggBanner from '@/components/gg-banner/gg-banner.vue'
export default {
components: {ggBanner}
}
1
2
3
4
2
3
4
在 template
中使用组件
<gg-banner :dataLists="dataLists" :paramConfig="{image:'image',text:'text'}" />
1
# 属性说明
属性名 | 类型 | 默认值 | 说明 |
---|---|---|---|
dataLists | Array | - | 图片数组 |
height | Number | 160 | 轮播的高度,单位:px |
paramConfig | Object | - | dataLists字段配置 |
indicatorDots | Boolean | true | 是否显示面板指示点 |
@change | EventHandle | current 改变时会触发 change 事件,event.detail = {current: current, source: source} |
# paramConfig
字段名 | 类型 | 默认值 | 说明 |
---|---|---|---|
image | String | image | 图片地址 |
text | String | text | 底部文字 |