官方示例代码
<uni-grid :column="4" :highlight="true" @change="change">
// method 为菜单点击的方法
<uni-grid-item v-for="(item, index) in MenuList" :index="index" :key="index" @click.stop="method">
<view class="grid-item-box" style="background-color: #fff;">
<uni-icons type="image" :size="30" color="#777" />
<text class="text">文本信息</text>
</view>
</uni-grid-item>
</uni-grid>
配置项 MenuList
menuList: [{
id: 0,
url: 'grid-item的路径',
event:'定义的方法'
},
{
id: 1,
url: 'grid-item的路径',
event:'定义的方法'
},
]
自定义事件调用
methods:{
callFun(funcName) {
let methods = this.$options.methods;
const _this = this;
// 调用event
methods[funcName].call(_this);
}
}
使用案例
methods:{
// 此处为菜单grid-item的点击事件
method(e) {
// 如何需要直接url跳转可在menuList中设置对应的url,无则设置为空字符串
// 根据url进行判断
if(e.url) {
uni.navigateTo({
url:e.url
})
}else {
// 调用自定义的调用方法
// 传递配置的event则可直接进行方法调用
this.callFun(e.event)
}
}
}