warm_man/components/FooterNav/index.vue

<template>

  <view class="footer-nav row">
    <view class="nav-item col-3 row" v-for="(item,index) in button" @click="commitFootCheck(item)">
      <view class="nav-ico col-12">
        <image mode="heightFix" class="img" :src="item.image+((item.name === footCheck)?'-active':'')+'.png'"/>
      </view>
      <view class="nav-title col-12" :class="{active:(item.name === footCheck)}">{{ item.title }}</view>
    </view>

  </view>
  <u-toast ref="uToast"></u-toast>
</template>

<script>
import {
  imghost
} from '@/config/host.js'
import api from "@/utils/functions";

export default {
  props: {
    button:{
      type:Object,
      default:[],
    }
  },
  data() {
    return {
      footCheck: 'home',
      title: 'Hello',
      loading: true,
      marginTop:0,
    }
  },
  onLoad() {

  },

  methods: {
    commitFootCheck(item) {
      let that = this;
      if(item.name !== 'disabled'){
        that.footCheck = item.name;
      }
      that.$emit('change',item)
    },
  },
  watch: {

  }
}
</script>

<style lang="scss">
@import '@/components/FooterNav/components/index.scss';
</style>