feat(AddressList): add tag slot and doc (#8311)

src/address-list/Item.tsx

@@ -29,6 +29,7 @@ export type AddressItemProps = {
 
 export type AddressItemSlots = DefaultSlots & {
   bottom?: ScopedSlot;
+  tag?: ScopedSlot;
 };
 
 export type AddressItemEvents = {
@@ -68,6 +69,9 @@ function AddressItem(
   );
 
   function genTag() {
+    if (slots.tag) {
+      return slots.tag({ ...props.data });
+    }
     if (props.data.isDefault && props.defaultTagText) {
       return (
         <Tag type="danger" round class={bem('tag')}>

src/address-list/README.md

@@ -105,11 +105,12 @@ export default {
 
 ### Slots
 
-| Name                 | Description                    | SlotProps |
+| Name                 | Description                       | SlotProps |
-| -------------------- | ------------------------------ | --------- |
+| -------------------- | --------------------------------- | --------- |
-| default              | Custom content after list      | -         |
+| default              | Custom content after list         | -         |
-| top                  | Custom content before list     | -         |
+| top                  | Custom content before list        | -         |
-| item-bottom `v2.5.0` | Custom content after list item | item      |
+| item-bottom `v2.5.0` | Custom content after list item    | item      |
+| tag                  | Custom tag conetent for list item | item      |
 
 ### Less Variables
 

src/address-list/README.zh-CN.md

@@ -114,6 +114,7 @@ export default {
 | default              | 在列表下方插入内容   | -          |
 | top                  | 在顶部插入内容       | -          |
 | item-bottom `v2.5.0` | 在列表项底部插入内容 | 列表项的值 |
+| tag                  | 列表项标签内容自定义 | 列表项的值 |
 
 ### 样式变量
 

src/address-list/index.tsx

@@ -24,6 +24,7 @@ export type AddressListProps = {
 export type AddressListSlots = DefaultSlots & {
   top?: ScopedSlot;
   'item-bottom'?: ScopedSlot;
+  tag?: ScopedSlot;
 };
 
 const [createComponent, bem, t] = createNamespace('address-list');
@@ -48,6 +49,7 @@ function AddressList(
         defaultTagText={props.defaultTagText}
         scopedSlots={{
           bottom: slots['item-bottom'],
+          tag: slots.tag,
         }}
         onSelect={() => {
           emit(ctx, disabled ? 'select-disabled' : 'select', item, index);

src/address-list/test/__snapshots__/index.spec.js.snap

@@ -1,5 +1,14 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`should render tag  slot correctly 1`] = `
+<div class="van-address-list">
+  <div role="radiogroup" class="van-radio-group"></div>
+  <div class="van-address-list__bottom"><button class="van-button van-button--danger van-button--normal van-button--block van-button--round van-address-list__add">
+      <div class="van-button__content"><span class="van-button__text">新增地址</span></div>
+    </button></div>
+</div>
+`;
+
 exports[`unswitchable 1`] = `
 <div class="van-address-list">
   <div role="radiogroup" class="van-radio-group">

src/address-list/test/index.spec.js

@@ -62,3 +62,12 @@ test('click-item event', () => {
 
   expect(onClickItem).toHaveBeenCalledTimes(1);
 });
+
+test('should render tag  slot correctly', () => {
+  const wrapper = mount(AddressList, {
+    scopedSlots: {
+      tag: () => 'Custom Tag',
+    },
+  });
+  expect(wrapper.html()).toMatchSnapshot();
+});