[Doc] update demo

example/components/demo-block/index.js

@@ -1,6 +1,7 @@
 Component({
   properties: {
-    title: String
+    title: String,
+    padding: Boolean
   },
 
   externalClasses: ['custom-class']

example/components/demo-block/index.wxml

@@ -1,4 +1,4 @@
-<view class="custom-class demo-block">
+<view class="custom-class demo-block {{ padding ? 'demo-block--padding' : '' }}">
   <view wx:if="{{ title }}" class="demo-block__title">{{ title }}</view>
   <slot />
 </view>

example/components/demo-block/index.wxss

@@ -1,11 +1,15 @@
-.demo-block {
-  padding: 0 15px;
-}
-
 .demo-block__title {
   margin: 0;
   font-weight: 400;
   font-size: 14px;
   color: rgba(69,90,100,.6);
-  padding: 20px 0 15px;
+  padding: 20px 15px 15px;
+}
+
+.demo-block--padding {
+  padding: 0 15px;
+}
+
+.demo-block--padding .demo-block__title {
+  padding-left: 0;
 }

example/pages/button/index.wxml

@@ -1,5 +1,5 @@
 <demo-section>
-  <demo-block title="按钮类型">
+  <demo-block title="按钮类型" padding>
     <view class="row">
       <van-button type="default" custom-class="demo-margin-right">默认按钮</van-button>
       <van-button type="primary">主要按钮</van-button>
@@ -8,7 +8,7 @@
     <van-button type="danger">危险按钮</van-button>
   </demo-block>
 
-  <demo-block title="朴素按钮">
+  <demo-block title="朴素按钮" padding>
     <view class="row">
       <van-button type="default" plain custom-class="demo-margin-right">默认按钮</van-button>
       <van-button type="primary" plain>主要按钮</van-button>
@@ -17,18 +17,18 @@
     <van-button type="danger" plain>危险按钮</van-button>
   </demo-block>
 
-  <demo-block title="按钮尺寸">
+  <demo-block title="按钮尺寸" padding>
     <van-button size="large" block custom-class="demo-margin-bottom">大号按钮</van-button>
     <van-button size="normal" class="demo-margin-right">普通按钮</van-button>
     <van-button size="small" class="demo-margin-right">小型按钮</van-button>
     <van-button size="mini">迷你按钮</van-button>
   </demo-block>
 
-  <demo-block title="禁用状态">
+  <demo-block title="禁用状态" padding>
     <van-button disabled>禁用状态</van-button>
   </demo-block>
 
-  <demo-block title="加载状态">
+  <demo-block title="加载状态" padding>
     <van-button loading custom-class="demo-margin-right" loading-class="loading" />
     <van-button loading type="primary" loading-class="loading" />
   </demo-block>

example/pages/card/index.wxml

@@ -6,7 +6,6 @@
       num="2"
       price="2.00"
       thumb="{{ imageURL }}"
-      custom-class="card"
     />
   </demo-block>
 
@@ -17,7 +16,6 @@
       num="2"
       price="2.00"
       thumb="{{ imageURL }}"
-      custom-class="card"
       use-footer-slot="{{ true }}"
     >
       <div slot="footer">

example/pages/card/index.wxss

@@ -3,10 +3,6 @@
   background-color: #fff;
 }
 
-.card {
-  margin: 0 -15px;
-}
-
 .button {
   margin-right: 5px;
 }

example/pages/loading/index.wxml

@@ -1,9 +1,9 @@
-<demo-block title="Circular">
+<demo-block title="Circular" padding>
   <van-loading custom-class="loading" />
   <van-loading custom-class="loading shadow" color="#fff" />
 </demo-block>
 
-<demo-block title="Spinner">
+<demo-block title="Spinner" padding>
   <van-loading custom-class="loading" type="spinner" />
   <van-loading custom-class="loading shadow" type="spinner" color="#fff" />
 </demo-block>

example/pages/stepper/index.wxml

@@ -1,12 +1,12 @@
-<demo-block title="基础用法">
+<demo-block title="基础用法" padding>
   <van-stepper value="{{ value1 }}" />
 </demo-block>
 
-<demo-block title="禁用状态">
+<demo-block title="禁用状态" padding>
   <van-stepper value="{{ value1 }}" disabled />
 </demo-block>
 
-<demo-block title="高级用法">
+<demo-block title="高级用法" padding>
   <van-stepper
     value="{{ value2 }}"
     integer

example/pages/switch/index.wxml

@@ -1,11 +1,11 @@
-<demo-block title="基础用法">
+<demo-block title="基础用法" padding>
   <van-switch
     checked="{{ checked }}"
     bind:change="onChange"
   />
 </demo-block>
 
-<demo-block title="禁用状态">
+<demo-block title="禁用状态" padding>
   <van-switch
     checked="{{ checked }}"
     disabled
@@ -13,7 +13,7 @@
   />
 </demo-block>
 
-<demo-block title="加载状态">
+<demo-block title="加载状态" padding>
   <van-switch
     checked="{{ checked }}"
     loading
@@ -21,7 +21,7 @@
   />
 </demo-block>
 
-<demo-block title="高级用法">
+<demo-block title="高级用法" padding>
   <van-switch
     checked="{{ checked2 }}"
     size="36px"

packages/cell-group/index.js

@@ -1,71 +1,8 @@
-const CELL_PATH = '../cell/index';
-const FIELD_PATH = '../field/index';
-
 Component({
-  properties: {
+  props: {
-    titleWidth: {
-      type: Number,
-      value: null
-    },
     border: {
       type: Boolean,
-      value: false
+      value: true
-    }
-  },
-  relations: {
-    [CELL_PATH]: {
-      type: 'child',
-      linked() {
-        this._updateIsLastElement(CELL_PATH);
-      },
-      linkChanged() {
-        this._updateIsLastElement(CELL_PATH);
-      },
-      unlinked() {
-        this._updateIsLastElement(CELL_PATH);
-      }
-    },
-    [FIELD_PATH]: {
-      type: 'child',
-      linked() {
-        this._updateIsLastElement(FIELD_PATH);
-      },
-      linkChanged() {
-        this._updateIsLastElement(FIELD_PATH);
-      },
-      unlinked() {
-        this._updateIsLastElement(FIELD_PATH);
-      }
-    }
-  },
-
-  data: {
-    elementUpdateTimeout: 0
-  },
-
-  methods: {
-    _updateIsLastElement(childPath) {
-      // 用 setTimeout 减少计算次数
-      if (this.data.elementUpdateTimeout > 0) {
-        return;
-      }
-
-      const elementUpdateTimeout = setTimeout(() => {
-        this.setData({ elementUpdateTimeout: 0 });
-        let elements = this.getRelationNodes(childPath);
-        const { titleWidth } = this.properties;
-
-        if (elements.length > 0) {
-          let lastIndex = elements.length - 1;
-
-          elements.forEach((cell, index) => {
-            titleWidth && cell.setTitleWidth(titleWidth)
-            cell.updateIsLastElement(index === lastIndex);
-          });
-        }
-      });
-
-      this.setData({ elementUpdateTimeout });
     }
   }
 });

packages/cell-group/index.pcss

@@ -1,14 +0,0 @@
-@import "../common/_mixins";
-
-.cell-group {
-  position: relative;
-  background-color: #fff;
-  overflow: hidden;
-}
-
-.cell-group--with-border::after {
-  @mixin hairline;
-
-  border-top-width: 1px;
-  border-bottom-width: 1px;
-}

packages/cell-group/index.wxml

@@ -1,3 +1,3 @@
-<view class="cell-group {{ border ? 'cell-group--with-border' : '' }}">
+<div class="van-cell-group {{ border ? 'van-hairline--top-bottom' : '' }}">
-  <slot></slot>
+  <slot />
-</view>
+</div>