Merge pull request #44 from TDesignOteam/fix/badge/css-standard

fix(badge): css standard
Tencent · Dec 16, 2021 · b05452d · b05452d
2 parents a2bb06d + 154a087
commit b05452d
Show file tree

Hide file tree

Showing 4 changed files with 14 additions and 16 deletions.
diff --git a/example/pages/badge/badge.less b/example/pages/badge/badge.less
@@ -19,13 +19,14 @@
 }
 
 .tab-bar-wrapper {
+  padding-top: 12rpx;
   &::after {
     content: '标签栏带徽标';
     position: absolute;
     top: -34px;
     left: 16px;
     line-height: 20px;
-    color: rgba(0, 0, 0, .4);
+    color: rgba(0, 0, 0, 0.4);
     font-size: 12px;
   }
-}
+}
diff --git a/src/badge/badge.less b/src/badge/badge.less
@@ -36,7 +36,7 @@
   }
 
   &--small {
-    transform: translate(50%, -50%) scale(.75);
+    transform: translate(50%, -50%) scale(0.75);
   }
 
   &--circle {
@@ -81,7 +81,7 @@
     }
   }
 
-  .content-slot:not(:empty) + .has-count {
+  &__content:not(:empty) + .t-has-count {
     transform: translate(50%, -50%);
     position: absolute;
     right: 0;

diff --git a/src/badge/badge.ts b/src/badge/badge.ts
@@ -1,14 +1,10 @@
-/*
- * @Author: rileycai
- * @Date: 2021-06-30 11:22:22
- * @LastEditTime: 2021-09-27 15:54:47
- * @LastEditors: Please set LastEditors
- * @Description: 第一次走查问题修复
- * @FilePath: /tdesign-miniprogram/src/badge/badge.ts
- */
 import { SuperComponent, wxComponent } from '../common/src/index';
+import config from '../common/config';
 import props from './props';
 
+const { prefix } = config;
+const name = `${prefix}-badge`;
+
 @wxComponent()
 export default class Badge extends SuperComponent {
   options = {
@@ -20,6 +16,7 @@ export default class Badge extends SuperComponent {
   properties = props;
 
   data = {
+    classPrefix: name,
     value: '',
   };
 }
diff --git a/src/badge/badge.wxml b/src/badge/badge.wxml
@@ -1,13 +1,13 @@
 <wxs src="./badge.wxs" module="this" />
 
 <view class="{{this.getBadgeOuterClass({shape})}} t-class">
-  <view class="content-slot">
-    <slot wx:if="{{!content}}" />
-    <text wx:else class="t-class-content">{{content}}</text>
+  <view class="{{classPrefix}}__content t-class-content">
+    <slot wx:if="{{!content}}" class="{{classPrefix}}__content-slot" />
+    <text wx:else class="{{classPrefix}}__content-text">{{content}}</text>
   </view>
   <view
     wx:if="{{count !== 'slot' && this.isShowBadge({dot,count,visible})}}"
-    class="{{this.getBadgeInnerClass({dot, size, shape})}} has-count t-class-count"
+    class="{{this.getBadgeInnerClass({dot, size, shape})}} t-has-count t-class-count"
     style="{{this.getBadgeStyles({color, offset})}}"
     >{{ this.getBadgeValue({dot, count, maxCount}) }}
   </view>