From fa5c8cd0b4bc7b0688c23e4ece5f6d6a3091717f Mon Sep 17 00:00:00 2001
From: neverland <chenjiahan@youzan.com>
Date: Fri, 19 Mar 2021 09:59:51 +0800
Subject: [PATCH] feat(Badge): add show-zero prop (#8381)

---
 src/badge/Badge.tsx          | 13 +++++++++++--
 src/badge/README.md          |  1 +
 src/badge/README.zh-CN.md    |  1 +
 src/badge/test/index.spec.ts | 13 +++++++++++++
 4 files changed, 26 insertions(+), 2 deletions(-)

diff --git a/src/badge/Badge.tsx b/src/badge/Badge.tsx
index 723eba83a..9550e257b 100644
--- a/src/badge/Badge.tsx
+++ b/src/badge/Badge.tsx
@@ -17,11 +17,20 @@ export default defineComponent({
       type: String as PropType<keyof HTMLElementTagNameMap>,
       default: 'div',
     },
+    showZero: {
+      type: Boolean,
+      default: true,
+    },
   },
 
   setup(props, { slots }) {
-    const hasContent = () =>
-      !!(slots.content || (isDef(props.content) && props.content !== ''));
+    const hasContent = () => {
+      if (slots.content) {
+        return true;
+      }
+      const { content, showZero } = props;
+      return isDef(content) && content !== '' && (showZero || content !== 0);
+    };
 
     const renderContent = () => {
       const { dot, max, content } = props;
diff --git a/src/badge/README.md b/src/badge/README.md
index c5a4d10bc..53f303789 100644
--- a/src/badge/README.md
+++ b/src/badge/README.md
@@ -120,6 +120,7 @@ Use `content` slot to custom :content of badge.
 | dot | Whether to show dot | _boolean_ | `false` |
 | max | Max value，show `{max}+` when exceed，only works when content is number | _number \| string_ | - |
 | offset `v3.0.5` | Offset of badge dot | _[number, number]_ | - |
+| show-zero `v3.0.10` | Whether to show badge when content is zero | _boolean_ | `true` |
 
 ### Slots
 
diff --git a/src/badge/README.zh-CN.md b/src/badge/README.zh-CN.md
index 925928fd0..dc9baaea3 100644
--- a/src/badge/README.zh-CN.md
+++ b/src/badge/README.zh-CN.md
@@ -132,6 +132,7 @@ app.use(Badge);
 | dot | 是否展示为小红点 | _boolean_ | `false` |
 | max | 最大值，超过最大值会显示 `{max}+`，仅当 content 为数字时有效 | _number \| string_ | - |
 | offset `v3.0.5` | 设置徽标的偏移量，数组的两项分别对应水平和垂直方向的偏移量 | _[number, number]_ | - |
+| show-zero `v3.0.10` | 当 content 为数字 0 时，是否展示徽标 | _boolean_ | `true` |
 
 ### Slots
 
diff --git a/src/badge/test/index.spec.ts b/src/badge/test/index.spec.ts
index 6c4dab364..644c2107a 100644
--- a/src/badge/test/index.spec.ts
+++ b/src/badge/test/index.spec.ts
@@ -69,3 +69,16 @@ test('should change dot position when using offset prop without children', () =>
   expect(badge.style.marginTop).toEqual('4px');
   expect(badge.style.marginLeft).toEqual('2px');
 });
+
+test('should not render zero when show-zero is false', async () => {
+  const wrapper = mount(Badge, {
+    props: {
+      content: 0,
+    },
+  });
+
+  expect(wrapper.find('.van-badge').exists()).toBeTruthy();
+
+  await wrapper.setProps({ showZero: false });
+  expect(wrapper.find('.van-badge').exists()).toBeFalsy();
+});