[bugfix] SwipeCell: should ensure ref exist before get width

docs/markdown/changelog.zh-CN.md

@@ -19,6 +19,10 @@
 
 - 支持`Number`类型的`input-width`属性
 
+##### SwipeCell
+
+- 修复只渲染单侧内容时报错的问题
+
 ##### Uploader
 
 - 新增`preview`属性

packages/swipe-cell/index.js

@@ -31,25 +31,24 @@ export default sfc({
 
   computed: {
     computedLeftWidth() {
-      if (this.leftWidth) {
+      return this.leftWidth || this.getWidthByRef('left');
-        return this.leftWidth;
-      }
-
-      const rect = this.$refs.left.getBoundingClientRect();
-      return rect.width;
     },
 
     computedRightWidth() {
-      if (this.rightWidth) {
+      return this.rightWidth || this.getWidthByRef('right');
-        return this.rightWidth;
-      }
-
-      const rect = this.$refs.right.getBoundingClientRect();
-      return rect.width;
     }
   },
 
   methods: {
+    getWidthByRef(ref) {
+      if (this.$refs[ref]) {
+        const rect = this.$refs[ref].getBoundingClientRect();
+        return rect.width;
+      }
+
+      return 0;
+    },
+
     open(position) {
       const offset = position === 'left' ? this.computedLeftWidth : -this.computedRightWidth;
       this.swipeMove(offset);

packages/swipe-cell/test/__snapshots__/index.spec.js.snap

@@ -53,3 +53,11 @@ exports[`drag and show right part 1`] = `
   </div>
 </div>
 `;
+
+exports[`render one side 1`] = `
+<div class="van-swipe-cell">
+  <div class="van-swipe-cell__wrapper" style="transform: translate3d(50px, 0, 0); transition: .6s cubic-bezier(0.18, 0.89, 0.32, 1);">
+    <div class="van-swipe-cell__left">Left</div>
+  </div>
+</div>
+`;

packages/swipe-cell/test/index.spec.js

@@ -106,3 +106,21 @@ it('auto calc width', async () => {
 
   restoreMock();
 });
+
+it('render one side', async () => {
+  const restoreMock = mockGetBoundingClientRect({
+    width: 50
+  });
+
+  const wrapper = mount(SwipeCell, {
+    scopedSlots: {
+      left: defaultProps.scopedSlots.left
+    }
+  });
+
+  await later();
+  triggerDrag(wrapper, 100, 0);
+  expect(wrapper).toMatchSnapshot();
+
+  restoreMock();
+});