index.js 1.7KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657
  1. import { VantComponent } from '../common/component';
  2. import { useParent } from '../common/relation';
  3. VantComponent({
  4. props: {
  5. info: null,
  6. name: null,
  7. icon: String,
  8. dot: Boolean,
  9. iconPrefix: {
  10. type: String,
  11. value: 'van-icon',
  12. },
  13. },
  14. relation: useParent('tabbar'),
  15. data: {
  16. active: false,
  17. activeColor: '',
  18. inactiveColor: '',
  19. },
  20. methods: {
  21. onClick() {
  22. const { parent } = this;
  23. if (parent) {
  24. const index = parent.children.indexOf(this);
  25. const active = this.data.name || index;
  26. if (active !== this.data.active) {
  27. parent.$emit('change', active);
  28. }
  29. }
  30. this.$emit('click');
  31. },
  32. updateFromParent() {
  33. const { parent } = this;
  34. if (!parent) {
  35. return;
  36. }
  37. const index = parent.children.indexOf(this);
  38. const parentData = parent.data;
  39. const { data } = this;
  40. const active = (data.name || index) === parentData.active;
  41. const patch = {};
  42. if (active !== data.active) {
  43. patch.active = active;
  44. }
  45. if (parentData.activeColor !== data.activeColor) {
  46. patch.activeColor = parentData.activeColor;
  47. }
  48. if (parentData.inactiveColor !== data.inactiveColor) {
  49. patch.inactiveColor = parentData.inactiveColor;
  50. }
  51. if (Object.keys(patch).length > 0) {
  52. this.setData(patch);
  53. }
  54. },
  55. },
  56. });