index.js 1.6KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566
  1. import { VantComponent } from '../common/component';
  2. import { useChildren } from '../common/relation';
  3. import { getRect } from '../common/utils';
  4. VantComponent({
  5. relation: useChildren('tabbar-item', function () {
  6. this.updateChildren();
  7. }),
  8. props: {
  9. active: {
  10. type: null,
  11. observer: 'updateChildren',
  12. },
  13. activeColor: {
  14. type: String,
  15. observer: 'updateChildren',
  16. },
  17. inactiveColor: {
  18. type: String,
  19. observer: 'updateChildren',
  20. },
  21. fixed: {
  22. type: Boolean,
  23. value: true,
  24. observer: 'setHeight',
  25. },
  26. placeholder: {
  27. type: Boolean,
  28. observer: 'setHeight',
  29. },
  30. border: {
  31. type: Boolean,
  32. value: true,
  33. },
  34. zIndex: {
  35. type: Number,
  36. value: 1,
  37. },
  38. safeAreaInsetBottom: {
  39. type: Boolean,
  40. value: true,
  41. },
  42. },
  43. data: {
  44. height: 50,
  45. },
  46. methods: {
  47. updateChildren() {
  48. const { children } = this;
  49. if (!Array.isArray(children) || !children.length) {
  50. return;
  51. }
  52. children.forEach((child) => child.updateFromParent());
  53. },
  54. setHeight() {
  55. if (!this.data.fixed || !this.data.placeholder) {
  56. return;
  57. }
  58. wx.nextTick(() => {
  59. getRect(this, '.van-tabbar').then((res) => {
  60. this.setData({ height: res.height });
  61. });
  62. });
  63. },
  64. },
  65. });