custom-tabbar.vue 1.6 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394
  1. <template>
  2. <view class="ezy-custom-tabbar">
  3. <view class="tabbar-item-box">
  4. <view class="tabbar-item" v-for="(item, index) in tabList" :key="index" @click="switchTab(item.path)"
  5. :style="{backgroundImage: 'url(' + item.iconPath + ')'}"></view>
  6. </view>
  7. </view>
  8. </template>
  9. <script>
  10. import {
  11. useTabBarHistory
  12. } from '@/utils/emitEvents.js';
  13. import {
  14. toast
  15. } from '@/utils/common'
  16. import cacheManager from "@/utils/cacheManager.js";
  17. import {
  18. getUserIdentity
  19. } from "@/utils/common.js"
  20. export default {
  21. data() {
  22. return {
  23. tabList: [{
  24. iconPath: 'static/images/tabbar/unselect/plan-sj.png',
  25. path: `/pages/study/index`
  26. },
  27. {
  28. iconPath: 'static/images/tabbar/unselect/partner-sj.png',
  29. path: '/pages/game/index'
  30. },
  31. {
  32. iconPath: 'static/images/tabbar/unselect/my-sj.png',
  33. path: `/pages/my/index`
  34. },
  35. ],
  36. };
  37. },
  38. props: {
  39. nianji: {
  40. type: String,
  41. },
  42. cardId: {
  43. type: String,
  44. },
  45. zhangId: {
  46. type: String,
  47. },
  48. },
  49. methods: {
  50. switchTab(path, params = {}) {
  51. if (getUserIdentity() == 'Visitor') {
  52. uni.redirectTo({
  53. url: path + '?nianji=' + this.nianji + '&cardId=' + this.cardId + '&zhangId=' + this
  54. .zhangId
  55. });
  56. }else{
  57. uni.redirectTo({
  58. url: path
  59. });
  60. }
  61. },
  62. },
  63. created() {
  64. console.log(this.nianji);
  65. }
  66. }
  67. </script>
  68. <style scoped>
  69. .custom-tabbar {
  70. display: flex;
  71. justify-content: space-around;
  72. align-items: center;
  73. /* 其他样式 */
  74. }
  75. .tab-item {
  76. flex: 1;
  77. /* 样式 */
  78. }
  79. .tab-icon {
  80. /* 图标样式 */
  81. }
  82. </style>