template-project/components/function-list/swiper-gong-ge

第一步：引入组件

import swiperGongGe from '@/components/function-list/swiper-gong-ge/swiper-gong-ge.vue';

第二步：注册组件

export default {
	components:{
		swiperGongGe
	}
}

第三步：使用组件

<template>
	<view>
		<swiper-gong-ge @chooseGe="chooseGe"></swiper-gong-ge>
	</view>
</template>

参数说明

list：列表数据，默认以下数组：
[
	[
		{url:'',iconsrc:'/static/tabbar/icon-select-person.png',iconWidth:60,iconHeight:60,title:'标题一'},
		{url:'',iconsrc:'/static/tabbar/icon-select-fun.png',iconWidth:60,iconHeight:60,title:'标题二'},
		{url:'',iconsrc:'/static/tabbar/icon-select-home.png',iconWidth:60,iconHeight:60,title:'标题三'},
		{url:'',iconsrc:'/static/tabbar/icon-select-news.png',iconWidth:60,iconHeight:60,title:'标题四'},
		{url:'',iconsrc:'/static/tabbar/icon-select-news.png',iconWidth:60,iconHeight:60,title:'标题四'},
		{url:'',iconsrc:'/static/tabbar/icon-select-news.png',iconWidth:60,iconHeight:60,title:'标题四'},
	],
	[
		{url:'',iconsrc:'/static/tabbar/icon-select-person.png',iconWidth:60,iconHeight:60,title:'标题一'},
		{url:'',iconsrc:'/static/tabbar/icon-select-fun.png',iconWidth:60,iconHeight:60,title:'标题二'},
		{url:'',iconsrc:'/static/tabbar/icon-select-home.png',iconWidth:60,iconHeight:60,title:'标题三'},
		{url:'',iconsrc:'/static/tabbar/icon-scan.png',iconWidth:60,iconHeight:60,title:'标题五'},
	]
]
ifAutoplay：是否自动轮播，默认false
rowNum：一排显示数量，默认5
titlec：标题颜色，默认#000000
fonts：字体大小，默认28rpx
titleTop：字体距离图标的距离，默认20rpx
itemTop：item的顶部距离，默认30rpx
activeStop：选中时指示点的颜色，默认rgba(0,0,0,1)
moStop：未选中时指示点的颜色，默认rgba(0,0,0,.2)

方法使用

export default {
	methods:{
		chooseGe(obj) {
			console.log(obj);
		},
	}
}