1.2 KiB
1.2 KiB
第一步:引入组件
import gongGeFunction from '@/components/function-list/gong-ge/gong-ge-function.vue';
第二步:注册组件
export default {
components:{
gongGeFunction
}
}
第三步:使用组件
<template>
<view>
<gong-ge-function @chooseGe="chooseGe"></gong-ge-function>
</view>
</template>
参数说明
list:列表数据,默认以下数组:
[
{url:'',iconsrc:'',iconWidth:60,iconHeight:60,title:'标题一'},
{url:'',iconsrc:'',iconWidth:60,iconHeight:60,title:'标题二'},
{url:'',iconsrc:'',iconWidth:60,iconHeight:60,title:'标题三'},
{url:'',iconsrc:'',iconWidth:60,iconHeight:60,title:'标题四'},
{url:'',iconsrc:'',iconWidth:60,iconHeight:60,title:'标题五'},
{url:'',iconsrc:'',iconWidth:60,iconHeight:60,title:'标题五'},
{url:'',iconsrc:'',iconWidth:60,iconHeight:60,title:'标题五'},
]
rowNum:一排显示数量,默认5
titlec:标题颜色,默认#000000
fonts:字体大小,默认28rpx
titleTop:字体距离图标的距离,默认20rpx
itemTop:item的顶部距离,默认30rpx
方法使用
export default {
methods:{
chooseGe(obj) {
console.log(obj);
},
}
}