@tdesign/uniapp 0.7.0 → 0.7.2

package/dist/link/link.vue

@@ -24,20 +24,20 @@
       <view :class="classPrefix + '__prefix-icon ' + tClassPrefixIcon">
         <slot name="prefix-icon" />
         <block
-          v-if="_prefixIcon"
+          v-if="iPrefixIcon"
           name="icon"
         >
           <t-icon
-            :custom-style="_prefixIcon.style || ''"
-            :t-class="_prefixIcon.tClass"
-            :prefix="_prefixIcon.prefix"
-            :name="_prefixIcon.name"
-            :size="_prefixIcon.size"
-            :color="_prefixIcon.color"
+            :custom-style="iPrefixIcon.style || ''"
+            :t-class="iPrefixIcon.tClass"
+            :prefix="iPrefixIcon.prefix"
+            :name="iPrefixIcon.name"
+            :size="iPrefixIcon.size"
+            :color="iPrefixIcon.color"
             :aria-hidden="true"
-            :aria-label="_prefixIcon.ariaLabel"
-            :aria-role="_prefixIcon.arialRole"
-            @click="_suffixIcon.click || ''"
+            :aria-label="iPrefixIcon.ariaLabel"
+            :aria-role="iPrefixIcon.arialRole"
+            @click="iSuffixIcon.click || ''"
           />
         </block>
       </view>
@@ -51,20 +51,20 @@
       <view :class="classPrefix + '__suffix-icon ' + tClassSuffixIcon">
         <slot name="suffix-icon" />
         <block
-          v-if="_suffixIcon"
+          v-if="iSuffixIcon"
           name="icon"
         >
           <t-icon
-            :custom-style="_suffixIcon.style || ''"
-            :t-class="_suffixIcon.tClass"
-            :prefix="_suffixIcon.prefix || ''"
-            :name="_suffixIcon.name"
-            :size="_suffixIcon.size"
-            :color="_suffixIcon.color"
+            :custom-style="iSuffixIcon.style || ''"
+            :t-class="iSuffixIcon.tClass"
+            :prefix="iSuffixIcon.prefix || ''"
+            :name="iSuffixIcon.name"
+            :size="iSuffixIcon.size"
+            :color="iSuffixIcon.color"
             :aria-hidden="true"
-            :aria-label="_suffixIcon.ariaLabel"
-            :aria-role="_suffixIcon.arialRole"
-            @click="_suffixIcon.click || ''"
+            :aria-label="iSuffixIcon.ariaLabel"
+            :aria-role="iSuffixIcon.arialRole"
+            @click="iSuffixIcon.click || ''"
           />
         </block>
       </view>
@@ -105,21 +105,21 @@ export default uniComponent({
       prefix,
       classPrefix: name,
       tools,
-      _prefixIcon: null,
-      _suffixIcon: null,
+      iPrefixIcon: null,
+      iSuffixIcon: null,
       className: '',
     };
   },
   watch: {
     prefixIcon: {
       handler(value) {
-        this._prefixIcon = calcIcon(value);
+        this.iPrefixIcon = calcIcon(value);
       },
       immediate: true,
     },
     suffixIcon: {
       handler(value) {
-        this._suffixIcon = calcIcon(value);
+        this.iSuffixIcon = calcIcon(value);
       },
       immediate: true,
     },
@@ -163,9 +163,8 @@ export default uniComponent({
   },
 });
 </script>
+<style scoped src="./link.css"></style>
 <style scoped>
-@import './link.css';
-
 /* #ifdef H5 */
 :deep(.navigator-wrap) {
   display: flex;

package/dist/loading/loading.vue

@@ -142,7 +142,7 @@ export default uniComponent({
       immediate: true,
     },
   },
-  beforeUnMount() {
+  beforeUnmount() {
     clearTimeout(this.timer);
   },
   methods: {
@@ -153,5 +153,5 @@ export default uniComponent({
 });
 
 </script>
-<style src="./loading.css"  scoped>
+<style src="./loading.css" scoped>
 </style>

package/dist/message/index.d.ts

@@ -1,7 +1,7 @@
 import { MessageProps } from './message.interface';
 declare type Context = any;
 declare type Instance = any;
-interface MessageActionOptionsType extends Optional<MessageProps> {
+interface MessageActionOptionsType extends Partial<MessageProps> {
   context?: Context;
   selector?: string;
 }

package/dist/message/message.interface.ts

@@ -1,3 +1,4 @@
+import type { TdMessageProps } from './type';
 
 export const MessageType = {
   info: 'info',
@@ -21,7 +22,7 @@ export interface MessageProps {
   closeBtn?: boolean;
   action?: string;
   marquee?: MessageMarquee;
-  offset?: object;
+  offset?: TdMessageProps['offset'];
   duration?: number;
   zIndex?: number;
   id?: string;

package/dist/message-item/message-item.vue

@@ -12,19 +12,19 @@
       <view :class="classPrefix + '__icon--left'">
         <slot name="icon" />
         <block
-          v-if="_icon"
+          v-if="innerIcon"
           name="icon"
         >
           <t-icon
-            :custom-style="_icon.style || ''"
+            :custom-style="innerIcon.style || ''"
             :t-class="tClassIcon"
-            :prefix="_icon.prefix"
-            :name="_icon.name"
-            :size="_icon.size"
-            :color="_icon.color"
+            :prefix="innerIcon.prefix"
+            :name="innerIcon.name"
+            :size="innerIcon.size"
+            :color="innerIcon.color"
             :aria-hidden="true"
-            :aria-label="_icon.ariaLabel"
-            :aria-role="_icon.ariaRole"
+            :aria-label="innerIcon.ariaLabel"
+            :aria-role="innerIcon.ariaRole"
           />
         </block>
       </view>
@@ -48,18 +48,18 @@
         </view>
       </view>
       <t-link
-        v-if="_link && _link.content"
+        v-if="innerLink && innerLink.content"
         :t-class="classPrefix + '__link ' + tClassLink"
-        :custom-style="tools._style([_link.style, _link.customStyle])"
-        :disabled="_link.disabled || false"
-        :hover="_link.hover || true"
-        :theme="_link.theme || 'primary'"
-        :size="_link.size || 'medium'"
-        :prefix-icon="_link.prefixIcon || ''"
-        :suffix-icon="_link.suffixIcon || ''"
-        :underline="_link.underline || false"
-        :content="_link.content || ''"
-        :navigator-props="_link.navigatorProps || null"
+        :custom-style="tools._style([innerLink.style, innerLink.customStyle])"
+        :disabled="innerLink.disabled || false"
+        :hover="innerLink.hover || true"
+        :theme="innerLink.theme || 'primary'"
+        :size="innerLink.size || 'medium'"
+        :prefix-icon="innerLink.prefixIcon || ''"
+        :suffix-icon="innerLink.suffixIcon || ''"
+        :underline="innerLink.underline || false"
+        :content="innerLink.content || ''"
+        :navigator-props="innerLink.navigatorProps || null"
         @complete="handleLinkClick"
       />
       <slot name="link" />
@@ -69,19 +69,19 @@
       >
         <slot name="close-btn" />
         <block
-          v-if="_closeBtn"
+          v-if="iCloseBtn"
           name="icon"
         >
           <t-icon
-            :custom-style="_closeBtn.style || ''"
+            :custom-style="iCloseBtn.style || ''"
             :t-class="tClassCloseBtn"
-            :prefix="_closeBtn.prefix"
-            :name="_closeBtn.name"
-            :size="_closeBtn.size"
-            :color="_closeBtn.color"
+            :prefix="iCloseBtn.prefix"
+            :name="iCloseBtn.name"
+            :size="iCloseBtn.size"
+            :color="iCloseBtn.color"
             :aria-hidden="false"
-            :aria-label="_closeBtn.ariaLabel || '关闭'"
-            :aria-role="_closeBtn.ariaRole || 'button'"
+            :aria-label="iCloseBtn.ariaLabel || '关闭'"
+            :aria-role="iCloseBtn.ariaRole || 'button'"
           />
         </block>
       </view>
@@ -173,13 +173,13 @@ export default uniComponent({
   watch: {
     theme: {
       handler(theme) {
-        this._icon = calcIcon(this.icon, THEME_ICON[theme]);
+        this.innerIcon = calcIcon(this.icon, THEME_ICON[theme]);
       },
       immediate: true,
     },
     icon: {
       handler(icon) {
-        this._icon = calcIcon(icon, THEME_ICON[this.theme]);
+        this.innerIcon = calcIcon(icon, THEME_ICON[this.theme]);
       },
       immediate: true,
     },
@@ -187,15 +187,15 @@ export default uniComponent({
 
     link: {
       handler(v) {
-        const _link = isObject(v) ? { ...v } : { content: v };
-        this._link = _link;
+        const innerLink = isObject(v) ? { ...v } : { content: v };
+        this.innerLink = innerLink;
       },
       immediate: true,
     },
 
     closeBtn: {
       handler(v) {
-        this._closeBtn = calcIcon(v, 'close');
+        this.iCloseBtn = calcIcon(v, 'close');
       },
       immediate: true,
     },
@@ -203,7 +203,7 @@ export default uniComponent({
   mounted() {
     this.memoInitialData();
   },
-  beforeUnMount() {
+  beforeUnmount() {
     this.clearMessageAnimation();
   },
   methods: {
@@ -348,6 +348,4 @@ export default uniComponent({
   },
 });
 </script>
-<style scoped>
-@import './message-item.css';
-</style>
+<style scoped src="./message-item.css"></style>

package/dist/mixins/page-scroll.js

@@ -53,7 +53,7 @@ export default (funcName = 'onScroll', useBus = true) => {
       page.onPageScroll = onPageScroll;
     },
 
-    beforeUnMount() {
+    beforeUnmount() {
       if (useBus) {
         bus.off(PAGE_SCROLL_EVENT_NAME, this[funcName]);
         return;

package/dist/navbar/navbar.vue

@@ -49,7 +49,7 @@
 <script>
 import TIcon from '../icon/icon';
 import { uniComponent } from '../common/src/index';
-import { getRect, systemInfo } from '../common/utils';
+import { getRect, getWindowInfo } from '../common/utils';
 import { prefix } from '../common/config';
 import props from './props';
 import tools from '../common/utils.wxs';
@@ -61,7 +61,7 @@ const BASE_MENU_RECT = {
   width: 87,
   height: 32,
   top: 24,
-  right: systemInfo.windowWidth - 10,
+  right: 10, // 距离右侧的间距，实际 right 值在 getMenuRect 中动态计算
 };
 
 
@@ -104,9 +104,9 @@ export default uniComponent({
       showTitle: '',
       hideLeft: false,
       hideCenter: false,
-      _menuRect: null,
-      _leftRect: null,
-      _boxStyle: {},
+      iMenuRect: null,
+      iLeftRect: null,
+      iBoxStyle: {},
       tools,
 
       visibleClass: '',
@@ -143,32 +143,43 @@ export default uniComponent({
     this.initStyle();
     this.getLeftRect();
     this.onMenuButtonBoundingClientRectWeightChange();
+
+    this.onWindowResizeCallback = () => {
+      this.initStyle();
+      this.getLeftRect();
+    };
+    uni.onWindowResize(this.onWindowResizeCallback);
   },
 
-  beforeUnMount() {
+  beforeUnmount() {
     this.offMenuButtonBoundingClientRectWeightChange();
+    if (this.onWindowResizeCallback) {
+      uni.offWindowResize(this.onWindowResizeCallback);
+    }
   },
   methods: {
     initStyle() {
-      this.getMenuRect();
+      // 每次重新获取最新的窗口信息，避免 H5 下窗口大小变化后使用缓存值
+      const windowInfo = getWindowInfo();
+      this.getMenuRect(windowInfo);
 
-      const { _menuRect, _leftRect } = this;
+      const { iMenuRect, iLeftRect } = this;
 
-      if (!_menuRect || !_leftRect || !systemInfo) return;
+      if (!iMenuRect || !iLeftRect || !windowInfo) return;
 
-      const _boxStyle = {
-        '--td-navbar-padding-top': `${systemInfo.statusBarHeight}px`,
-        '--td-navbar-right': `${systemInfo.windowWidth - _menuRect.left}px`, // 导航栏右侧小程序胶囊按钮宽度
-        '--td-navbar-left-max-width': `${_menuRect.left}px`, // 左侧内容最大宽度
-        '--td-navbar-capsule-height': `${_menuRect.height}px`, // 胶囊高度
-        '--td-navbar-capsule-width': `${_menuRect.width}px`, // 胶囊宽度
-        '--td-navbar-height': `${(_menuRect.top - systemInfo.statusBarHeight) * 2 + _menuRect.height}px`,
+      const iBoxStyle = {
+        '--td-navbar-padding-top': `${windowInfo.statusBarHeight}px`,
+        '--td-navbar-right': `${windowInfo.windowWidth - iMenuRect.left}px`, // 导航栏右侧小程序胶囊按钮宽度
+        '--td-navbar-left-max-width': `${iMenuRect.left}px`, // 左侧内容最大宽度
+        '--td-navbar-capsule-height': `${iMenuRect.height}px`, // 胶囊高度
+        '--td-navbar-capsule-width': `${iMenuRect.width}px`, // 胶囊宽度
+        '--td-navbar-height': `${(iMenuRect.top - windowInfo.statusBarHeight) * 2 + iMenuRect.height}px`,
       };
       // #ifdef H5 || APP-PLUS
-      delete _boxStyle['--td-navbar-height'];
+      delete iBoxStyle['--td-navbar-height'];
       // #endif
 
-      this.calcCenterStyle(_leftRect, _menuRect, _boxStyle);
+      this.calcCenterStyle(iLeftRect, iMenuRect, iBoxStyle, windowInfo);
     },
     onWatchTitle() {
       const { title } = this;
@@ -183,48 +194,52 @@ export default uniComponent({
       leftRect,
       menuRect,
       defaultStyle,
+      windowInfo,
     ) {
-      const maxSpacing = Math.max(leftRect.right, systemInfo.windowWidth - menuRect.left);
-      const _boxStyle = {
+      const curWindowInfo = windowInfo || getWindowInfo();
+      const maxSpacing = Math.max(leftRect.right, curWindowInfo.windowWidth - menuRect.left);
+      const iBoxStyle = {
         ...defaultStyle,
         'z-index': this.zIndex,
         '--td-navbar-center-left': `${maxSpacing}px`, // 标题左侧距离
         '--td-navbar-center-width': `${Math.max(menuRect.left - maxSpacing, 0)}px`, // 标题宽度
       };
 
-      const boxStyle = Object.entries(_boxStyle)
+      const boxStyle = Object.entries(iBoxStyle)
         .map(([k, v]) => `${k}: ${v}`)
         .join('; ');
 
       this.boxStyle = boxStyle;
-      this._boxStyle = _boxStyle;
+      this.iBoxStyle = iBoxStyle;
     },
 
     getLeftRect() {
       getRect(this, `.${name}__left`).then((res) => {
-        if (res.right > this._leftRect.right) {
-          this.calcCenterStyle(res, this._menuRect, this._boxStyle);
+        if (res.right > this.iLeftRect.right) {
+          this.calcCenterStyle(res, this.iMenuRect, this.iBoxStyle);
         }
       });
     },
 
-    getMenuRect() {
+    getMenuRect(windowInfo) {
+      const curWindowInfo = windowInfo || getWindowInfo();
       // 场景值为1177（视频号直播间）和1175 （视频号profile页）时，小程序禁用了 uni.getMenuButtonBoundingClientRect
       let rect = {
         ...BASE_MENU_RECT,
+        right: curWindowInfo.windowWidth - BASE_MENU_RECT.right, // 动态计算，避免 H5 下缓存
         bottom: BASE_MENU_RECT.top + BASE_MENU_RECT.height,
-        left: BASE_MENU_RECT.right - BASE_MENU_RECT.width,
+        left: curWindowInfo.windowWidth - BASE_MENU_RECT.right - BASE_MENU_RECT.width,
       };
       if (uni.getMenuButtonBoundingClientRect
          && typeof uni.getMenuButtonBoundingClientRect === 'function'
-         && typeof uni.getMenuButtonBoundingClientRect()  === 'object'
+         && typeof uni.getMenuButtonBoundingClientRect() === 'object'
       ) {
         rect = uni.getMenuButtonBoundingClientRect() || {};
       }
 
-      this._menuRect = rect;
-      this._leftRect = {
-        right: systemInfo.windowWidth - rect.left,
+      this.iMenuRect = rect;
+      this.iLeftRect = {
+        right: curWindowInfo.windowWidth - rect.left,
       };
     },
 
@@ -288,6 +303,4 @@ export default uniComponent({
   },
 });
 </script>
-<style scoped>
-@import './navbar.css';
-</style>
+<style scoped src="./navbar.css"></style>

package/dist/notice-bar/notice-bar.vue

@@ -13,20 +13,20 @@
     >
       <slot name="prefix-icon" />
       <block
-        v-if="_prefixIcon"
+        v-if="iPrefixIcon"
         name="icon"
       >
         <t-icon
-          :custom-style="_prefixIcon.style || ''"
+          :custom-style="iPrefixIcon.style || ''"
           :t-class="tClassPrefixIcon"
-          :prefix="_prefixIcon.prefix"
-          :name="_prefixIcon.name"
-          :size="_prefixIcon.size"
-          :color="_prefixIcon.color"
-          :aria-hidden="!!_prefixIcon.ariaHidden"
-          :aria-label="_prefixIcon.ariaLabel"
-          :aria-role="_prefixIcon.ariaRole"
-          @click="_prefixIcon.bindclick || ''"
+          :prefix="iPrefixIcon.prefix"
+          :name="iPrefixIcon.name"
+          :size="iPrefixIcon.size"
+          :color="iPrefixIcon.color"
+          :aria-hidden="!!iPrefixIcon.ariaHidden"
+          :aria-label="iPrefixIcon.ariaLabel"
+          :aria-role="iPrefixIcon.ariaRole"
+          @click="iPrefixIcon.bindclick || ''"
         />
       </block>
     </view>
@@ -82,20 +82,20 @@
     >
       <slot name="suffix-icon" />
       <block
-        v-if="_suffixIcon"
+        v-if="iSuffixIcon"
         name="icon"
       >
         <t-icon
-          :custom-style="_suffixIcon.style || ''"
+          :custom-style="iSuffixIcon.style || ''"
           :t-class="tClassSuffixIcon"
-          :prefix="_suffixIcon.prefix"
-          :name="_suffixIcon.name"
-          :size="_suffixIcon.size"
-          :color="_suffixIcon.color"
-          :aria-hidden="!!_suffixIcon.ariaHidden"
-          :aria-label="_suffixIcon.ariaLabel"
-          :aria-role="_suffixIcon.ariaRole"
-          @click="_suffixIcon.bindclick || ''"
+          :prefix="iSuffixIcon.prefix"
+          :name="iSuffixIcon.name"
+          :size="iSuffixIcon.size"
+          :color="iSuffixIcon.color"
+          :aria-hidden="!!iSuffixIcon.ariaHidden"
+          :aria-label="iSuffixIcon.ariaLabel"
+          :aria-role="iSuffixIcon.ariaRole"
+          @click="iSuffixIcon.bindclick || ''"
         />
       </block>
     </view>
@@ -185,7 +185,7 @@ export default uniComponent({
 
     suffixIcon: {
       handler(v) {
-        this._suffixIcon = calcIcon(v);
+        this.iSuffixIcon = calcIcon(v);
       },
       immediate: true,
     },
@@ -209,7 +209,7 @@ export default uniComponent({
     this.show();
     this.__ready = true;
   },
-  beforeUnMount() {
+  beforeUnmount() {
     this.clearNoticeBarAnimation();
   },
   methods: {
@@ -295,7 +295,7 @@ export default uniComponent({
 
     setPrefixIcon(v) {
       const { theme } = this;
-      this._prefixIcon = calcIcon(v, THEME_ICON[theme]);
+      this.iPrefixIcon = calcIcon(v, THEME_ICON[theme]);
     },
 
     onChange(e) {
@@ -321,6 +321,4 @@ export default uniComponent({
   },
 });
 </script>
-<style scoped>
-@import './notice-bar.css';
-</style>
+<style scoped src="./notice-bar.css"></style>

package/dist/overlay/overlay.vue

@@ -5,7 +5,7 @@
       :class="prefix + '-overlay ' + transitionClass"
       :style="tools._style([
         '--td-overlay-transition-duration:' + duration + 'ms',
-        'z-index:' + _zIndex, 'top:' + distanceTop + 'px',
+        'z-index:' + iZIndex, 'top:' + distanceTop + 'px',
         computedStyle,
         customStyle
       ])"
@@ -22,7 +22,7 @@
       v-else-if="realVisible"
       :class="prefix + '-overlay ' + transitionClass "
       :style="tools._style([
-        'z-index:' + _zIndex,
+        'z-index:' + iZIndex,
         'top:' + distanceTop + 'px',
         computedStyle,
         customStyle
@@ -69,7 +69,7 @@ export default uniComponent({
       prefix,
       classPrefix: name,
       computedStyle: '',
-      _zIndex: 11000,
+      iZIndex: 11000,
       tools,
     };
   },
@@ -83,7 +83,7 @@ export default uniComponent({
     zIndex: {
       handler(v) {
         if (v !== 0) {
-          this._zIndex = v;
+          this.iZIndex = v;
         }
       },
       immediate: true,
@@ -100,6 +100,4 @@ export default uniComponent({
   },
 });
 </script>
-<style scoped>
-@import './overlay.css';
-</style>
+<style scoped src="./overlay.css"></style>

package/dist/picker/picker.vue

@@ -9,7 +9,7 @@
       :using-custom-navbar="usingCustomNavbar || (popupProps && popupProps.usingCustomNavbar)"
       :custom-navbar-height="coalesce(customNavbarHeight, popupProps && popupProps.usingCustomNavbar)"
       :z-index="(popupProps && popupProps.zIndex) || defaultPopUpzIndex"
-      :overlay-props="(popupProps && popupProps.overlayProps) || defaultPopUpProps"
+      :overlay-props="(popupProps && popupProps.overlayProps) || defaultOverlayProps"
       @visible-change="onPopupChange"
     >
       <template #content>
@@ -147,7 +147,7 @@ export default uniComponent({
     return {
       prefix,
       classPrefix: name,
-      defaultPopUpProps: {},
+      defaultOverlayProps: {},
       defaultPopUpzIndex: 11500,
       indicatorTop: 72, // 默认indicator位置，会动态计算
 
@@ -302,9 +302,8 @@ export default uniComponent({
   },
 });
 </script>
+<style scoped src="./picker.css"></style>
 <style scoped>
-@import './picker.css';
-
 /* #ifndef MP-WEIXIN */
 /* 适配 qq 小程序等 */
 :deep(t-picker-item) {

package/dist/picker-item/picker-item.vue

@@ -185,7 +185,7 @@ export default uniComponent({
 
   },
 
-  beforeUnMount() {
+  beforeUnmount() {
     // 清理定时器，防止内存泄漏
     if (this._animationTimer) {
       clearInterval(this._animationTimer);
@@ -441,6 +441,4 @@ export default uniComponent({
   },
 });
 </script>
-<style scoped>
-@import './picker-item.css';
-</style>
+<style scoped src="./picker-item.css"></style>

package/dist/popover/popover.vue

@@ -347,6 +347,4 @@ export default uniComponent({
 
 
 </script>
-<style scoped>
-@import './popover.css';
-</style>
+<style scoped src="./popover.css"></style>

package/dist/popup/popup.vue

@@ -58,7 +58,7 @@
       :using-custom-navbar="usingCustomNavbar"
       :custom-navbar-height="customNavbarHeight"
       :z-index="(overlayProps && overlayProps.zIndex) || 11000"
-      :duration="(overlayProps && overlayProps.duration) || 300"
+      :duration="(overlayProps && overlayProps.duration) || duration || 300"
       :background-color="(overlayProps && overlayProps.backgroundColor) || ''"
       :prevent-scroll-through="preventScrollThrough || (overlayProps ? !!overlayProps.preventScrollThrough : false)"
       :custom-style="(overlayProps && overlayProps.style) || ''"
@@ -136,6 +136,4 @@ export default uniComponent({
 });
 
 </script>
-<style scoped>
-@import './popup.css';
-</style>
+<style scoped src="./popup.css"></style>

package/dist/progress/progress.vue

@@ -254,6 +254,4 @@ export default uniComponent({
   },
 });
 </script>
-<style scoped>
-@import './progress.css';
-</style>
+<style scoped src="./progress.css"></style>