feat: add Empty component (#6010)

src/empty/test/__snapshots__/demo.spec.js.snap

@@ -0,0 +1,53 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`renders demo correctly 1`] = `
+<div>
+  <div>
+    <div class="van-empty">
+      <div class="van-empty__image"><img src="https://img.yzcdn.cn/vant/empty-image-default.png"></div>
+      <p class="van-empty__description">描述文字</p>
+    </div>
+  </div>
+  <div>
+    <div class="van-tabs van-tabs--line">
+      <div class="van-tabs__wrap van-hairline--top-bottom">
+        <div role="tablist" class="van-tabs__nav van-tabs__nav--line">
+          <div role="tab" aria-selected="true" class="van-tab van-tab--active van-ellipsis"><span class="van-tab__text">通用错误<!----></span></div>
+          <div role="tab" class="van-tab van-ellipsis"><span class="van-tab__text">网络错误<!----></span></div>
+          <div role="tab" class="van-tab van-ellipsis"><span class="van-tab__text">搜索提示<!----></span></div>
+          <div class="van-tabs__line" style="width: 0px; transform: translateX(0px) translateX(-50%);"></div>
+        </div>
+      </div>
+      <div class="van-tabs__content">
+        <div role="tabpanel" class="van-tab__pane" style="">
+          <div class="van-empty">
+            <div class="van-empty__image"><img src="https://img.yzcdn.cn/vant/empty-image-error.png"></div>
+            <p class="van-empty__description">描述文字</p>
+          </div>
+        </div>
+        <div role="tabpanel" class="van-tab__pane" style="display: none;">
+          <!---->
+        </div>
+        <div role="tabpanel" class="van-tab__pane" style="display: none;">
+          <!---->
+        </div>
+      </div>
+    </div>
+  </div>
+  <div>
+    <div class="custom-image van-empty">
+      <div class="van-empty__image"><img src="https://img.yzcdn.cn/vant/custom-empty-image.png"></div>
+      <p class="van-empty__description">描述文字</p>
+    </div>
+  </div>
+  <div>
+    <div class="van-empty">
+      <div class="van-empty__image"><img src="https://img.yzcdn.cn/vant/empty-image-default.png"></div>
+      <p class="van-empty__description">描述文字</p>
+      <div class="van-empty__bottom"><button class="bottom-button van-button van-button--danger van-button--normal van-button--round"><span class="van-button__text">
+        按钮
+      </span></button></div>
+    </div>
+  </div>
+</div>
+`;

src/empty/test/__snapshots__/index.spec.js.snap

@@ -0,0 +1,14 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`description slot 1`] = `
+<div class="van-empty">
+  <div class="van-empty__image"><img src="https://img.yzcdn.cn/vant/empty-image-default.png"></div>
+  <p class="van-empty__description">Custom description</p>
+</div>
+`;
+
+exports[`image slot 1`] = `
+<div class="van-empty">
+  <div class="van-empty__image">Custom Image</div>
+</div>
+`;

src/empty/test/demo.spec.js

@@ -0,0 +1,4 @@
+import Demo from '../demo';
+import { snapshotDemo } from '../../../test/demo';
+
+snapshotDemo(Demo);

src/empty/test/index.spec.js

@@ -0,0 +1,22 @@
+import Empty from '..';
+import { mount } from '../../../test';
+
+test('image slot', () => {
+  const wrapper = mount(Empty, {
+    scopedSlots: {
+      image: () => 'Custom Image',
+    },
+  });
+
+  expect(wrapper).toMatchSnapshot();
+});
+
+test('description slot', () => {
+  const wrapper = mount(Empty, {
+    scopedSlots: {
+      description: () => 'Custom description',
+    },
+  });
+
+  expect(wrapper).toMatchSnapshot();
+});