You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

74 lines
1.6 KiB

<template>
<view class="foot-nav row">
<view class="foot-nav-background-group">
<view class="foot-nav-background">
<view class="foot-nav-background-small"></view>
</view>
</view>
<view class="foot-nav-button-group row">
<view class="col-3 foot-nav-button" v-for="(item,index) in footGroup"
:class="{active:(item.name === footCheck)}"
:style="{
backgroundImage:'url('+item.image+ ((index === footCheck)?'-active':'')+'.png)',
backgroundSize:'auto '+((index === footCheck)?'81':'54')+'rpx',
display:(item.is_show)?'flex':'none'
}" @click="selectItem(index)">
</view>
</view>
</view>
</template>
<script>
import {
imghost
} from '@/config/host.js'
export default {
props: {
footGroup:{
type:Object,
default:{}
},
footCheck:{
type:Number,
default:0
},
},
data() {
return {
check:0,
}
},
onLoad() {
console.log(this.footGroup)
},
methods: {
selectItem(index){
this.current = index;
this.$emit('change',index)
},
commitFootCheck(item) {
this.$store.commit('footCheck',item.name);
this.$store.commit('title',item.title);
console.log('commit');
},
isFootCheck() {
// return this.;
}
},
mounted() {
this.check = this.footCheck;
},
watch: {
"$store.state.footCheck": {
handler(newVal, oldVal) {
this.footCheck = newVal;
}
}
}
}
</script>
<style lang="scss">
@import '@/components/FooterNav/components/index.scss';
</style>