tui-tabbar.js 1.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283
  1. Component({
  2. properties: {
  3. //当前索引
  4. current: {
  5. type: Number,
  6. value: 0
  7. },
  8. //字体颜色
  9. color: {
  10. type: String,
  11. value: "#666"
  12. },
  13. //字体选中颜色
  14. selectedColor: {
  15. type: String,
  16. value: "#5677FC"
  17. },
  18. //背景颜色
  19. backgroundColor: {
  20. type: String,
  21. value: "#FFFFFF"
  22. },
  23. //是否需要中间凸起按钮
  24. hump: {
  25. type: Boolean,
  26. value: false
  27. },
  28. //固定在底部
  29. isFixed: {
  30. type: Boolean,
  31. value: true
  32. },
  33. //tabbar
  34. // "pagePath": "/pages/my/my", 页面路径
  35. // "text": "thor", 标题
  36. // "iconPath": "thor_gray.png", 图标地址
  37. // "selectedIconPath": "thor_active.png", 选中图标地址
  38. // "hump": true, 是否为凸起图标
  39. // "num": 2, 角标数量
  40. // "isDot": true, 角标是否为圆点
  41. // "verify": true 是否验证 (如登录)
  42. tabBar: {
  43. type: Array,
  44. value: []
  45. },
  46. //角标字体颜色
  47. badgeColor: {
  48. type: String,
  49. value: "#fff"
  50. },
  51. //角标背景颜色
  52. badgeBgColor: {
  53. type: String,
  54. value: "#F74D54"
  55. },
  56. unlined: {
  57. type: Boolean,
  58. value: false
  59. }
  60. },
  61. data: {
  62. },
  63. methods: {
  64. tabbarSwitch(e) {
  65. let index = Number(e.currentTarget.dataset.index);
  66. let hump = false;
  67. let pagePath = "";
  68. let verify = false
  69. if (this.data.tabBar.length > 0) {
  70. hump = this.data.tabBar[index].hump;
  71. pagePath = this.data.tabBar[index].pagePath;
  72. verify = this.data.tabBar[index].verify;
  73. }
  74. this.triggerEvent("click", {
  75. index: index,
  76. hump: hump,
  77. pagePath: pagePath,
  78. verify: verify
  79. })
  80. }
  81. }
  82. })