Browse Source

addresslist slot (#2045)

* feat: 处理组件tsc问题

* feat: popup icons-vue

* feat: 删除注释

* feat: 删除多余注释

* feat: popup icons-vue

* feat: popup taro demo修改icon

* feat: popup md 修改

* feat: navbar icon替换

* feat: progress icon替换

* feat: navbar 修改titicon参数名

* feat: navbar md titicon

* fix: navbar icon

* feat: 优化价格文档描述和demo

* feat: 文档类型修改

* feat: 优化addresslist

* feat: 修复avatar taro下图片未显示问题

* feat: 小程序demo 文档对比修改

* fix: 修改avatar图片展示问题

* fix: avatar图片展示问题

* fix: 测试中的一些文档问题

* fix: addresslist demo、文档问题

* fix: addresslist taro demo问题

* feat: addresslist 滑动下边框问题

* fix: avatar tarodiv下落问题

* fix: 修复category 问题

* feat: addresslist slot
ailululu 2 years ago
parent
commit
6187c74674

+ 14 - 14
src/packages/__VUE/addresslist/components/GeneralShell.taro.vue

@@ -1,18 +1,18 @@
 <template>
 <template>
   <div class="nut-address-list-general" v-if="!swipeEdition">
   <div class="nut-address-list-general" v-if="!swipeEdition">
     <component :is="renderCompontent()" @touchstart="holddownstart" @touchend="holddownend" @touchmove="holddownmove">
     <component :is="renderCompontent()" @touchstart="holddownstart" @touchend="holddownend" @touchmove="holddownmove">
-      <template v-slot:contentTop>
-        <slot name="contentInfo"></slot>
+      <template #content-top>
+        <slot name="content-info"></slot>
       </template>
       </template>
-      <template v-slot:contentIcon>
-        <slot name="contentIcons"></slot>
+      <template #content-icon>
+        <slot name="content-icons"></slot>
       </template>
       </template>
-      <template v-slot:contentAddr>
-        <slot name="contentAddrs"></slot>
+      <template #content-addr>
+        <slot name="content-addrs"></slot>
       </template>
       </template>
     </component>
     </component>
     <div class="nut-address-list-general__mask" v-if="longPress && showMaskRef" @click="maskClick">
     <div class="nut-address-list-general__mask" v-if="longPress && showMaskRef" @click="maskClick">
-      <slot name="longpressAll">
+      <slot name="longpress-all">
         <div class="nut-address-list-general__mask-copy" @click="copyCLick"> 复制地址 </div>
         <div class="nut-address-list-general__mask-copy" @click="copyCLick"> 复制地址 </div>
         <div class="nut-address-list-general__mask-set" @click="setDefault"> 设置默认 </div>
         <div class="nut-address-list-general__mask-set" @click="setDefault"> 设置默认 </div>
         <div class="nut-address-list-general__mask-del" @click="delLongClick"> 删除地址 </div>
         <div class="nut-address-list-general__mask-del" @click="delLongClick"> 删除地址 </div>
@@ -23,19 +23,19 @@
   <nut-swipe v-else>
   <nut-swipe v-else>
     <div class="nut-address-list-swipe">
     <div class="nut-address-list-swipe">
       <component :is="renderCompontent()" @touchmove="swipemove" @touchstart="swipestart">
       <component :is="renderCompontent()" @touchmove="swipemove" @touchstart="swipestart">
-        <template v-slot:contentTop>
-          <slot name="contentInfo"></slot>
+        <template #content-top>
+          <slot name="content-info"></slot>
         </template>
         </template>
-        <template v-slot:contentIcon>
-          <slot name="contentIcons"></slot>
+        <template #content-icon>
+          <slot name="content-icons"></slot>
         </template>
         </template>
-        <template v-slot:contentAddr>
-          <slot name="contentAddrs"></slot>
+        <template #content-addr>
+          <slot name="content-addrs"></slot>
         </template>
         </template>
       </component>
       </component>
     </div>
     </div>
     <template #right>
     <template #right>
-      <slot name="swiperightbtn">
+      <slot name="swipe-right-btn">
         <nut-button shape="square" style="height: 100%" type="danger" @click="swipeDelClick">删除</nut-button>
         <nut-button shape="square" style="height: 100%" type="danger" @click="swipeDelClick">删除</nut-button>
       </slot>
       </slot>
     </template>
     </template>

+ 14 - 14
src/packages/__VUE/addresslist/components/GeneralShell.vue

@@ -1,18 +1,18 @@
 <template>
 <template>
   <div class="nut-address-list-general" v-if="!swipeEdition">
   <div class="nut-address-list-general" v-if="!swipeEdition">
     <component :is="renderCompontent()" @touchstart="holddownstart" @touchend="holddownend" @touchmove="holddownmove">
     <component :is="renderCompontent()" @touchstart="holddownstart" @touchend="holddownend" @touchmove="holddownmove">
-      <template v-slot:contentTop>
-        <slot name="contentInfo"></slot>
+      <template #content-top>
+        <slot name="content-info"></slot>
       </template>
       </template>
-      <template v-slot:contentIcon>
-        <slot name="contentIcons"></slot>
+      <template #content-icon>
+        <slot name="content-icons"></slot>
       </template>
       </template>
-      <template v-slot:contentAddr>
-        <slot name="contentAddrs"></slot>
+      <template #content-addr>
+        <slot name="content-addrs"></slot>
       </template>
       </template>
     </component>
     </component>
     <div class="nut-address-list-general__mask" v-if="longPress && showMaskRef" @click="maskClick">
     <div class="nut-address-list-general__mask" v-if="longPress && showMaskRef" @click="maskClick">
-      <slot name="longpressAll">
+      <slot name="longpress-all">
         <div class="nut-address-list-general__mask-copy" @click="copyCLick"> 复制地址 </div>
         <div class="nut-address-list-general__mask-copy" @click="copyCLick"> 复制地址 </div>
         <div class="nut-address-list-general__mask-set" @click="setDefault"> 设置默认 </div>
         <div class="nut-address-list-general__mask-set" @click="setDefault"> 设置默认 </div>
         <div class="nut-address-list-general__mask-del" @click="delLongClick"> 删除地址 </div>
         <div class="nut-address-list-general__mask-del" @click="delLongClick"> 删除地址 </div>
@@ -23,19 +23,19 @@
   <nut-swipe v-else>
   <nut-swipe v-else>
     <div class="nut-address-list-swipe">
     <div class="nut-address-list-swipe">
       <component :is="renderCompontent()" @touchmove="swipemove" @touchstart="swipestart">
       <component :is="renderCompontent()" @touchmove="swipemove" @touchstart="swipestart">
-        <template v-slot:contentTop>
-          <slot name="contentInfo"></slot>
+        <template #content-top>
+          <slot name="content-info"></slot>
         </template>
         </template>
-        <template v-slot:contentIcon>
-          <slot name="contentIcons"></slot>
+        <template #content-icon>
+          <slot name="content-icons"></slot>
         </template>
         </template>
-        <template v-slot:contentAddr>
-          <slot name="contentAddrs"></slot>
+        <template #content-addr>
+          <slot name="content-addrs"></slot>
         </template>
         </template>
       </component>
       </component>
     </div>
     </div>
     <template #right>
     <template #right>
-      <slot name="swiperightbtn">
+      <slot name="swipe-right-btn">
         <nut-button shape="square" style="height: 100%" type="danger" @click="swipeDelClick">删除</nut-button>
         <nut-button shape="square" style="height: 100%" type="danger" @click="swipeDelClick">删除</nut-button>
       </slot>
       </slot>
     </template>
     </template>

+ 3 - 3
src/packages/__VUE/addresslist/components/ItemContents.taro.vue

@@ -2,7 +2,7 @@
   <div class="nut-address-list-item" @click="contentsClick">
   <div class="nut-address-list-item" @click="contentsClick">
     <div class="nut-address-list-item__info">
     <div class="nut-address-list-item__info">
       <div class="nut-address-list-item__info-contact">
       <div class="nut-address-list-item__info-contact">
-        <slot name="contentTop">
+        <slot name="content-top">
           <div class="nut-address-list-item__info-contact-name">{{ item.addressName }}</div>
           <div class="nut-address-list-item__info-contact-name">{{ item.addressName }}</div>
           <div class="nut-address-list-item__info-contact-tel">{{ item.phone }}</div>
           <div class="nut-address-list-item__info-contact-tel">{{ item.phone }}</div>
           <div class="nut-address-list-item__info-contact-default" v-if="item.defaultAddress">{{
           <div class="nut-address-list-item__info-contact-default" v-if="item.defaultAddress">{{
@@ -11,14 +11,14 @@
         </slot>
         </slot>
       </div>
       </div>
       <div class="nut-address-list-item__info-handle">
       <div class="nut-address-list-item__info-handle">
-        <slot name="contentIcon">
+        <slot name="content-icon">
           <Del name="del" class="nut-address-list-item__info-handle-del" @click="delClick"></Del>
           <Del name="del" class="nut-address-list-item__info-handle-del" @click="delClick"></Del>
           <Edit name="edit" class="nut-address-list-item__info-handle-edit" @click="editClick"></Edit>
           <Edit name="edit" class="nut-address-list-item__info-handle-edit" @click="editClick"></Edit>
         </slot>
         </slot>
       </div>
       </div>
     </div>
     </div>
     <div class="nut-address-list-item__addr">
     <div class="nut-address-list-item__addr">
-      <slot name="contentAddr">
+      <slot name="content-addr">
         {{ item.fullAddress }}
         {{ item.fullAddress }}
       </slot>
       </slot>
     </div>
     </div>

+ 3 - 3
src/packages/__VUE/addresslist/components/ItemContents.vue

@@ -2,7 +2,7 @@
   <div class="nut-address-list-item" @click="contentsClick">
   <div class="nut-address-list-item" @click="contentsClick">
     <div class="nut-address-list-item__info">
     <div class="nut-address-list-item__info">
       <div class="nut-address-list-item__info-contact">
       <div class="nut-address-list-item__info-contact">
-        <slot name="contentTop">
+        <slot name="content-top">
           <div class="nut-address-list-item__info-contact-name">{{ item.addressName }}</div>
           <div class="nut-address-list-item__info-contact-name">{{ item.addressName }}</div>
           <div class="nut-address-list-item__info-contact-tel">{{ item.phone }}</div>
           <div class="nut-address-list-item__info-contact-tel">{{ item.phone }}</div>
           <div class="nut-address-list-item__info-contact-default" v-if="item.defaultAddress">{{
           <div class="nut-address-list-item__info-contact-default" v-if="item.defaultAddress">{{
@@ -11,14 +11,14 @@
         </slot>
         </slot>
       </div>
       </div>
       <div class="nut-address-list-item__info-handle">
       <div class="nut-address-list-item__info-handle">
-        <slot name="contentIcon">
+        <slot name="content-icon">
           <Del name="del" class="nut-address-list-item__info-handle-del" @click="delClick"></Del>
           <Del name="del" class="nut-address-list-item__info-handle-del" @click="delClick"></Del>
           <Edit name="edit" class="nut-address-list-item__info-handle-edit" @click="editClick"></Edit>
           <Edit name="edit" class="nut-address-list-item__info-handle-edit" @click="editClick"></Edit>
         </slot>
         </slot>
       </div>
       </div>
     </div>
     </div>
     <div class="nut-address-list-item__addr">
     <div class="nut-address-list-item__addr">
-      <slot name="contentAddr">
+      <slot name="content-addr">
         {{ item.fullAddress }}
         {{ item.fullAddress }}
       </slot>
       </slot>
     </div>
     </div>

+ 3 - 3
src/packages/__VUE/addresslist/doc.en-US.md

@@ -261,11 +261,11 @@ The `AddressList` component is divided into several areas by default, and these
 
 
 | Name          | Description                                     | Illustrate  |
 | Name          | Description                                     | Illustrate  |
 | ------------- | ----------------------------------------------- | ----------- |
 | ------------- | ----------------------------------------------- | ----------- |
-| iteminfos     | Address list item name/contact/default one line | public      |
+| item-infos     | Address list item name/contact/default one line | public      |
 | itemicon      | address list item icon                          | public      |
 | itemicon      | address list item icon                          | public      |
 | itemaddr      | Address list item detailed address              | public      |
 | itemaddr      | Address list item detailed address              | public      |
-| swiperight    | Address list item right swipe area              | Use with swipe |
-| longpressbtns | Address list item long press to mask content    | Use with long press |
+| swipe-right    | Address list item right swipe area              | Use with swipe |
+| longpress-btns | Address list item long press to mask content    | Use with long press |
 
 
 ### Each item in the data array is smoothed with the parameters of the dataOptions object
 ### Each item in the data array is smoothed with the parameters of the dataOptions object
 
 

+ 3 - 3
src/packages/__VUE/addresslist/doc.md

@@ -262,11 +262,11 @@ export default {
 
 
 | 名称        | 说明                             | 说明           |
 | 名称        | 说明                             | 说明           |
 | ------------- | -------------------------------- | -------------- |
 | ------------- | -------------------------------- | -------------- |
-| iteminfos     | 地址列表项姓名/联系方式/默认一行 | 公共           |
+| item-infos     | 地址列表项姓名/联系方式/默认一行 | 公共           |
 | itemicon      | 地址列表项图标                   | 公共           |
 | itemicon      | 地址列表项图标                   | 公共           |
 | itemaddr      | 地址列表项详细地址               | 公共           |
 | itemaddr      | 地址列表项详细地址               | 公共           |
-| swiperight    | 地址列表项右滑区域               | 滑动功能下使用 |
-| longpressbtns | 地址列表项长按遮罩内容           | 长按功能下使用 |
+| swipe-right    | 地址列表项右滑区域               | 滑动功能下使用 |
+| longpress-btns | 地址列表项长按遮罩内容           | 长按功能下使用 |
 
 
 ### data 数组中每一项 与 dataOptions 对象的参数磨平
 ### data 数组中每一项 与 dataOptions 对象的参数磨平
 
 

+ 3 - 3
src/packages/__VUE/addresslist/doc.taro.md

@@ -262,11 +262,11 @@ export default {
 
 
 | 名称          | 说明                             | 说明           |
 | 名称          | 说明                             | 说明           |
 | ------------- | -------------------------------- | -------------- |
 | ------------- | -------------------------------- | -------------- |
-| iteminfos     | 地址列表项姓名/联系方式/默认一行 | 公共           |
+| item-infos     | 地址列表项姓名/联系方式/默认一行 | 公共           |
 | itemicon      | 地址列表项图标                   | 公共           |
 | itemicon      | 地址列表项图标                   | 公共           |
 | itemaddr      | 地址列表项详细地址               | 公共           |
 | itemaddr      | 地址列表项详细地址               | 公共           |
-| swiperight    | 地址列表项右滑区域               | 滑动功能下使用 |
-| longpressbtns | 地址列表项长按遮罩内容           | 长按功能下使用 |
+| swipe-right    | 地址列表项右滑区域               | 滑动功能下使用 |
+| longpress-btns | 地址列表项长按遮罩内容           | 长按功能下使用 |
 
 
 ### data 数组中每一项 与 dataOptions 对象的参数磨平
 ### data 数组中每一项 与 dataOptions 对象的参数磨平
 
 

+ 10 - 10
src/packages/__VUE/addresslist/index.taro.vue

@@ -14,20 +14,20 @@
       @longSet="clickLongSet"
       @longSet="clickLongSet"
       @longDel="clickLongDel"
       @longDel="clickLongDel"
     >
     >
-      <template v-slot:contentInfo>
-        <slot name="iteminfos"></slot>
+      <template #content-info>
+        <slot name="item-infos"></slot>
       </template>
       </template>
-      <template v-slot:contentIcons>
-        <slot name="itemicon"></slot>
+      <template #content-icons>
+        <slot name="item-icon"></slot>
       </template>
       </template>
-      <template v-slot:contentAddrs>
-        <slot name="itemaddr"></slot>
+      <template #content-addrs>
+        <slot name="item-addr"></slot>
       </template>
       </template>
-      <template v-slot:longpressAll v-if="longPress">
-        <slot name="longpressbtns"></slot>
+      <template #longpress-all v-if="longPress">
+        <slot name="longpress-btns"></slot>
       </template>
       </template>
-      <template v-slot:swiperightbtn v-if="swipeEdition">
-        <slot name="swiperight"></slot>
+      <template #swipe-right-btn v-if="swipeEdition">
+        <slot name="swipe-right"></slot>
       </template>
       </template>
     </general-shell>
     </general-shell>
     <div class="nut-address-list__bottom" v-if="showBottomButton" @click="addAddress">
     <div class="nut-address-list__bottom" v-if="showBottomButton" @click="addAddress">

+ 8 - 8
src/packages/__VUE/addresslist/index.vue

@@ -14,20 +14,20 @@
       @longSet="clickLongSet"
       @longSet="clickLongSet"
       @longDel="clickLongDel"
       @longDel="clickLongDel"
     >
     >
-      <template v-slot:contentInfo>
-        <slot name="iteminfos"></slot>
+      <template #content-info>
+        <slot name="item-infos"></slot>
       </template>
       </template>
-      <template v-slot:contentIcons>
+      <template #content-icons>
         <slot name="itemicon"></slot>
         <slot name="itemicon"></slot>
       </template>
       </template>
-      <template v-slot:contentAddrs>
+      <template #content-addrs>
         <slot name="itemaddr"></slot>
         <slot name="itemaddr"></slot>
       </template>
       </template>
-      <template v-slot:longpressAll v-if="longPress">
-        <slot name="longpressbtns"></slot>
+      <template #longpress-all v-if="longPress">
+        <slot name="longpress-btns"></slot>
       </template>
       </template>
-      <template v-slot:swiperightbtn v-if="swipeEdition">
-        <slot name="swiperight"></slot>
+      <template #swipe-right-btn v-if="swipeEdition">
+        <slot name="swipe-right"></slot>
       </template>
       </template>
     </general-shell>
     </general-shell>
     <div class="nut-address-list__bottom" v-if="showBottomButton" @click="addAddress">
     <div class="nut-address-list__bottom" v-if="showBottomButton" @click="addAddress">