u-tabbar-item.js 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990
  1. "use strict";
  2. const common_vendor = require("../../../../common/vendor.js");
  3. const _sfc_main = {
  4. name: "u-tabbar-item",
  5. mixins: [common_vendor.mpMixin, common_vendor.mixin, common_vendor.props$2],
  6. data() {
  7. return {
  8. isActive: false,
  9. // 是否处于激活状态
  10. parentData: {
  11. value: null,
  12. activeColor: "",
  13. inactiveColor: ""
  14. }
  15. };
  16. },
  17. // 微信小程序中 options 选项
  18. options: {
  19. virtualHost: true
  20. //将自定义节点设置成虚拟的,更加接近Vue组件的表现。我们不希望自定义组件的这个节点本身可以设置样式、响应 flex 布局等
  21. },
  22. created() {
  23. this.init();
  24. },
  25. methods: {
  26. init() {
  27. this.updateParentData();
  28. if (!this.parent) {
  29. common_vendor.index.$u.error("u-tabbar-item必须搭配u-tabbar组件使用");
  30. }
  31. const index = this.parent.children.indexOf(this);
  32. this.isActive = (this.name || index) === this.parentData.value;
  33. },
  34. updateParentData() {
  35. this.getParentData("u-tabbar");
  36. },
  37. // 此方法将会被父组件u-tabbar调用
  38. updateFromParent() {
  39. this.init();
  40. },
  41. clickHandler() {
  42. this.$nextTick(() => {
  43. const index = this.parent.children.indexOf(this);
  44. const name = this.name || index;
  45. if (name !== this.parent.value) {
  46. this.parent.$emit("change", name);
  47. }
  48. this.$emit("click", name);
  49. });
  50. }
  51. }
  52. };
  53. if (!Array) {
  54. const _easycom_u_icon2 = common_vendor.resolveComponent("u-icon");
  55. const _easycom_u_badge2 = common_vendor.resolveComponent("u-badge");
  56. (_easycom_u_icon2 + _easycom_u_badge2)();
  57. }
  58. const _easycom_u_icon = () => "../u-icon/u-icon.js";
  59. const _easycom_u_badge = () => "../u-badge/u-badge.js";
  60. if (!Math) {
  61. (_easycom_u_icon + _easycom_u_badge)();
  62. }
  63. function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
  64. return common_vendor.e({
  65. a: _ctx.icon
  66. }, _ctx.icon ? {
  67. b: common_vendor.p({
  68. name: _ctx.icon,
  69. color: $data.isActive ? $data.parentData.activeColor : $data.parentData.inactiveColor,
  70. size: 20
  71. })
  72. } : common_vendor.e({
  73. c: $data.isActive
  74. }, $data.isActive ? {} : {}), {
  75. d: common_vendor.p({
  76. absolute: true,
  77. offset: [0, _ctx.dot ? "34rpx" : _ctx.badge > 9 ? "14rpx" : "20rpx"],
  78. customStyle: _ctx.badgeStyle,
  79. isDot: _ctx.dot,
  80. value: _ctx.badge || (_ctx.dot ? 1 : null),
  81. show: _ctx.dot || _ctx.badge > 0
  82. }),
  83. e: common_vendor.t(_ctx.text),
  84. f: $data.isActive ? $data.parentData.activeColor : $data.parentData.inactiveColor,
  85. g: common_vendor.s(_ctx.$u.addStyle(_ctx.customStyle)),
  86. h: common_vendor.o((...args) => $options.clickHandler && $options.clickHandler(...args))
  87. });
  88. }
  89. const Component = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-a54be951"], ["__file", "F:/兴元/开门柜项目/平台端管理系统小程序/node_modules/uview-plus/components/u-tabbar-item/u-tabbar-item.vue"]]);
  90. wx.createComponent(Component);