konggang-city-miniprogram/components/foot-tabs/footTabs.vue

<template>
  <div class="hover_content">
    <div class="hover_menu flex">
      <div
        class="menu_icon"
        v-for="(menu, i) in menus"
        :key="i"
        @tap="click(i, menu.pagePath)"
      >
        <img :src="menu.selectedIconPath" v-if="selectedIndex == i" />
        <img :src="menu.iconPath" v-else />
      </div>
    </div>
  </div>
</template>
<style lang="scss" scoped>
.hover_content {
  width: 30%;
  padding: 1.5% 1%;
  border-radius: 100rpx;
  position: fixed;
  left: 50%;
  top: 88%;
  transform: translateX(-50%);
  box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
  background-color: #fff;
  .hover_menu {
    display: flex;
    justify-content: space-around;
    .menu_icon {
      img {
        width: 60rpx;
        height: 60rpx;
      }
    }
  }
}
</style>
<script>
export default {
  data() {
    return {
      selectedIndex: getApp().globalData.selectedIndex,
      showselected: false,
      menus: [
        {
          pagePath: "pages/index/index",
          iconPath: "/static/tabbar/home-select.png",
          selectedIconPath: "/static/tabbar/home-selected.png",
          text: "首页",
        },
        {
          pagePath: "pages/selfCenter/index",
          iconPath: "/static/tabbar/user-select.png",
          selectedIconPath: "/static/tabbar/user-selected.png",
          text: "我的",
        },
      ],
    };
  },
  methods: {
    click(index, src) {
      var pages = getCurrentPages(); //获取加载的页面
      var currentPage = pages[pages.length - 1]; //获取当前页面的对象
      var url = currentPage.route; //当前页面url
      getApp().globalData.selectedIndex = index;
      let res_url = this.check(url);
      let res_src = this.check(src);
      console.log(getApp().globalData.selectedIndex);
      // console.log(res_url,res_src);
      if (!(res_url&&res_src) && !(res_url == false && res_src == false)) {
        uni.navigateTo({
          url: "/" + src,
        });
      }
    },
    check(url) {
      let isTure = false;
      let arr = ["pages/index/index",
          "pages/park/park_deatil",
          "pages/appeal/index",
          "pages/appeal/myAppeal",
          "pages/appeal/putAppeal",
          "pages/appeal/appeal_detail",
          "pages/policy/index",
          "pages/policy/policy_deatil",
          "pages/park/index",
          "pages/park/map_search",
          "pages/activity/index",
          "pages/supply/index",
          "pages/enterprise/index",
          "pages/service/index"];
      for (let i = 0; i < arr.length; i++) {
        let e = arr[i]
        if (e == url) {
          isTure = true;
          return isTure
        }
      }
      return isTure;
    },
  },
};
</script>