@tdesign/uniapp 0.7.3 → 0.8.1

package/dist/draggable/draggable.vue

@@ -1,7 +1,7 @@
 <template>
   <view
     :class="[classPrefix, tClass]"
-    :style="tools._style([customStyle])"
+    :style="'' + tools._style([customStyle])"
     @touchstart="onTouchStart"
     @touchmove.stop.prevent="onTouchMove"
     @touchend="onTouchEnd"
@@ -19,72 +19,74 @@ import tools from '../common/utils.wxs';
 
 const name = `${prefix}-draggable`;
 
-export default uniComponent({
-  name,
-  options: {
-    styleIsolation: 'shared',
-  },
-  props: {
-    ...props,
-  },
-  emits: [
-    'move',
-    'start',
-    'end',
-  ],
-  data() {
-    return {
-      prefix,
-      classPrefix: name,
-      tools,
-      systemInfo: getWindowInfo(),
-    };
-  },
-  mounted() {
-    this.computedRect();
-  },
-  methods: {
-    onTouchStart(e) {
-      const { systemInfo } = this;
-      if (this.direction === 'none') return;
-      this.startX = e.touches[0].clientX + systemInfo.windowWidth - this.rect.right;
-      this.startY = e.touches[0].clientY + systemInfo.windowHeight - this.rect.bottom;
-      this.$emit('start', { startX: this.startX, startY: this.startY, rect: this.rect, e });
+export default {
+  ...uniComponent({
+    name,
+    options: {
+      styleIsolation: 'shared',
     },
+    props: {
+      ...props,
+    },
+    emits: [
+      'move',
+      'start',
+      'end',
+    ],
+    data() {
+      return {
+        prefix,
+        classPrefix: name,
+        tools,
+        systemInfo: getWindowInfo(),
+      };
+    },
+    mounted() {
+      this.computedRect();
+    },
+    methods: {
+      onTouchStart(e) {
+        const { systemInfo } = this;
+        if (this.direction === 'none') return;
+        this.startX = e.touches[0].clientX + systemInfo.windowWidth - this.rect.right;
+        this.startY = e.touches[0].clientY + systemInfo.windowHeight - this.rect.bottom;
+        this.$emit('start', { startX: this.startX, startY: this.startY, rect: this.rect, e });
+      },
 
-    onTouchMove(e) {
-      const { systemInfo } = this;
+      onTouchMove(e) {
+        const { systemInfo } = this;
 
-      if (this.direction === 'none') return;
-      let x = this.startX - e.touches[0].clientX; // x轴移动偏移量
-      let y = this.startY - e.touches[0].clientY; // y轴移动偏移量
+        if (this.direction === 'none') return;
+        let x = this.startX - e.touches[0].clientX; // x轴移动偏移量
+        let y = this.startY - e.touches[0].clientY; // y轴移动偏移量
 
 
-      if (this.direction === 'vertical') {
-        x = systemInfo.windowWidth - this.rect.right;
-      }
-      if (this.direction === 'horizontal') {
-        y = systemInfo.windowHeight - this.rect.bottom;
-      }
+        if (this.direction === 'vertical') {
+          x = systemInfo.windowWidth - this.rect.right;
+        }
+        if (this.direction === 'horizontal') {
+          y = systemInfo.windowHeight - this.rect.bottom;
+        }
 
-      this.$emit('move', { x, y, rect: this.rect, e });
-    },
+        this.$emit('move', { x, y, rect: this.rect, e });
+      },
 
-    async onTouchEnd(e) {
-      if (this.direction === 'none') return;
-      await this.computedRect();
-      this.$emit('end', { rect: this.rect, e });
-    },
+      async onTouchEnd(e) {
+        if (this.direction === 'none') return;
+        await this.computedRect();
+        this.$emit('end', { rect: this.rect, e });
+      },
 
-    async computedRect() {
-      this.rect = { right: 0, bottom: 0, width: 0, height: 0 };
-      try {
-        this.rect = await getRect(this, `.${this.classPrefix}`);
-      } catch (e) {
+      async computedRect() {
+        this.rect = { right: 0, bottom: 0, width: 0, height: 0 };
+        try {
+          this.rect = await getRect(this, `.${this.classPrefix}`);
+        } catch (e) {
         // ignore reject
-      }
+        }
+      },
     },
-  },
-});
+  }),
+};
 </script>
 <style scoped src="./draggable.css"></style>

package/dist/drawer/README.md

@@ -1,7 +1,7 @@
 ---
 title: Drawer 抽屉
 description: 用作一组平行关系页面/内容的切换器，相较于Tab，同屏可展示更多的选项数量。
-spline: message
+spline: navigation
 isComponent: true
 ---
 
@@ -9,7 +9,9 @@ isComponent: true
 
 ## 引入
 
-可在 `main.ts` 或在需要使用的页面或组件中引入。
+推荐使用 easycom 模式引入组件，配置后无需手动 import 即可直接在模板中使用 `<t-drawer />`。详细配置请参考 [快速开始](../getting-started)。
+
+如需手动引入：
 
 ```js
 import TDrawer from '@tdesign/uniapp/drawer/drawer.vue';

package/dist/drawer/drawer.vue

@@ -75,64 +75,66 @@ import tools from '../common/utils.wxs';
 const name = `${prefix}-drawer`;
 
 
-export default uniComponent({
-  name,
-  options: {
-    styleIsolation: 'shared',
-  },
-  mixins: [
-    useCustomNavbar,
-  ],
+export default {
   components: {
     TPopup,
     TIcon,
   },
-  props: {
-    ...props,
-  },
-  emits: [
-    'update:visible',
-    'close',
-    'overlay-click',
-    'item-click',
-  ],
-  data() {
-    return {
-      classPrefix: name,
-      tools,
-      dataVisible: coalesce(this.visible, this.defaultVisible),
-    };
-  },
-  watch: {
-    visible(e) {
-      this.dataVisible = e;
+  ...uniComponent({
+    name,
+    options: {
+      styleIsolation: 'shared',
     },
-  },
-  methods: {
+    mixins: [
+      useCustomNavbar,
+    ],
+    props: {
+      ...props,
+    },
+    emits: [
+      'update:visible',
+      'close',
+      'overlay-click',
+      'item-click',
+    ],
+    data() {
+      return {
+        classPrefix: name,
+        tools,
+        dataVisible: coalesce(this.visible, this.defaultVisible),
+      };
+    },
+    watch: {
+      visible(e) {
+        this.dataVisible = e;
+      },
+    },
+    methods: {
     // closeOnOverlayClick 为 true 时才能触发 popup 的 visible-change 事件
-    onVisibleChange(detail) {
-      const { visible } = detail;
-      const { showOverlay } = this;
+      onVisibleChange(detail) {
+        const { visible } = detail;
+        const { showOverlay } = this;
 
-      this.dataVisible = visible;
+        this.dataVisible = visible;
 
-      if (!visible) {
-        this.$emit('close', { trigger: 'overlay' });
-      }
+        if (!visible) {
+          this.$emit('close', { trigger: 'overlay' });
+        }
 
-      if (showOverlay) {
-        this.$emit('overlay-click', { visible });
-      }
-      this.$emit('update:visible', visible);
-    },
+        if (showOverlay) {
+          this.$emit('overlay-click', { visible });
+        }
+        this.$emit('update:visible', visible);
+      },
 
-    onItemClick(detail) {
-      const { index, item } = detail.currentTarget.dataset;
+      onItemClick(detail) {
+        const { index, item } = detail.currentTarget.dataset;
 
-      this.$emit('item-click', { index, item });
+        this.$emit('item-click', { index, item });
+      },
     },
-  },
-});
+  }),
+};
 </script>
 <style scoped src="./drawer.css"></style>
 <style>