custom-tabbar-kehu.vue 1.4 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152
  1. <template>
  2. <view class="phone-client-tabbar">
  3. <view class="tabbar-item" v-for="(item, index) in tabList" :key="index" @click="switchTab(item.path,index)">
  4. <!-- <icon :style="{ backgroundImage: 'url(' + (currentTab == index ? item.activePath : item.iconPath) + ')' }"></icon> -->
  5. <image class="tabbar-item-icon" :src="currentTab === index ? item.activePath : item.iconPath" mode="aspectFit"></image>
  6. <text class="tabbar-item-text">{{item.text}}</text>
  7. </view>
  8. </view>
  9. </template>
  10. <script>
  11. import {getStaticUrl} from '@/utils/common.js';
  12. import {
  13. useTabBarHistory
  14. } from '@/utils/emitEvents.js';
  15. import cacheManager from "@/utils/cacheManager.js";
  16. export default {
  17. props: {
  18. currentTab: {
  19. type: Number,
  20. }
  21. },
  22. data() {
  23. return {
  24. tabList: [{
  25. text: '首页',
  26. path: `/pages/kehu/shouYe/shouye`,
  27. iconPath: '/static/images/tabbar/unselect/client-jz-icon.png',
  28. activePath:'/static/images/tabbar/select/client-jz-icon.png',
  29. },
  30. {
  31. text: '我的',
  32. path: `/pages/kehu/my/my`,
  33. iconPath: '/static/images/tabbar/unselect/client-my-icon.png',
  34. activePath: '/static/images/tabbar/select/client-my-icon.png',
  35. },
  36. ],
  37. };
  38. },
  39. methods: {
  40. switchTab(path, index) {
  41. if (index == this.currentTab) {
  42. // 同页面不刷新
  43. return;
  44. }
  45. uni.redirectTo({url: path});
  46. },
  47. },
  48. }
  49. </script>