docs: remove demo-section

packages/create-vant-cli-app/generators/templates/src/demo-button/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block title="基础用法">
     <demo-button type="primary" style="margin-left: 15px;">按钮</demo-button>
   </demo-block>
@@ -7,5 +6,4 @@
   <demo-block title="自定义颜色">
     <demo-button color="#03a9f4" style="margin-left: 15px;">按钮</demo-button>
   </demo-block>
-  </demo-section>
 </template>

src/action-bar/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('basicUsage')">
     <van-action-bar>
       <van-action-bar-icon
@@ -39,11 +38,7 @@
     <van-action-bar>
       <van-action-bar-icon icon="chat-o" :text="t('icon1')" color="#07c160" />
       <van-action-bar-icon icon="cart-o" :text="t('icon2')" />
-        <van-action-bar-icon
+      <van-action-bar-icon icon="star" :text="t('collected')" color="#ff5000" />
-          icon="star"
-          :text="t('collected')"
-          color="#ff5000"
-        />
       <van-action-bar-button type="warning" :text="t('button1')" />
       <van-action-bar-button type="danger" :text="t('button2')" />
     </van-action-bar>
@@ -65,7 +60,6 @@
       />
     </van-action-bar>
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/action-sheet/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block card :title="t('basicUsage')">
     <van-cell is-link :title="t('basicUsage')" @click="show.basic = true" />
     <van-cell is-link :title="t('showCancel')" @click="show.cancel = true" />
@@ -11,11 +10,7 @@
   </demo-block>
 
   <demo-block card :title="t('optionStatus')">
-      <van-cell
+    <van-cell is-link :title="t('optionStatus')" @click="show.status = true" />
-        is-link
-        :title="t('optionStatus')"
-        @click="show.status = true"
-      />
   </demo-block>
 
   <demo-block card :title="t('customPanel')">
@@ -54,7 +49,6 @@
   <van-action-sheet v-model:show="show.title" :title="t('title')">
     <div class="demo-action-sheet-content">{{ t('content') }}</div>
   </van-action-sheet>
-  </demo-section>
 </template>
 
 <script>

src/address-edit/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('basicUsage')">
     <van-address-edit
       :area-list="areaList"
@@ -14,7 +13,6 @@
       @change-detail="onChangeDetail"
     />
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/address-list/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('basicUsage')">
     <van-address-list
       v-model="chosenAddressId"
@@ -11,7 +10,6 @@
       @edit="onEdit"
     />
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/area/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block card :title="t('basicUsage')">
     <van-area :title="t('title')" :area-list="t('areaList')" />
   </demo-block>
@@ -9,11 +8,7 @@
   </demo-block>
 
   <demo-block card :title="t('title3')">
-      <van-area
+    <van-area :title="t('title')" :area-list="t('areaList')" :columns-num="2" />
-        :title="t('title')"
-        :area-list="t('areaList')"
-        :columns-num="2"
-      />
   </demo-block>
 
   <demo-block card :title="t('title4')">
@@ -23,7 +18,6 @@
       :columns-placeholder="t('columnsPlaceholder')"
     />
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/badge/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('basicUsage')">
     <van-badge content="5">
       <div class="child" />
@@ -30,7 +29,6 @@
   <demo-block :title="t('standalone')">
     <van-badge content="200" max="99" style="margin-left: 16px;" />
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/button/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('type')">
     <div class="demo-button-row">
       <van-button type="primary">{{ t('primary') }}</van-button>
@@ -59,11 +58,7 @@
   </demo-block>
 
   <demo-block v-if="!isWeapp" :title="t('router')">
-      <van-button
+    <van-button :text="t('urlRoute')" type="primary" url="/vant/mobile.html" />
-        :text="t('urlRoute')"
-        type="primary"
-        url="/vant/mobile.html"
-      />
     <van-button :text="t('vueRoute')" type="primary" to="index" />
   </demo-block>
 
@@ -75,7 +70,6 @@
       :text="t('gradient')"
     />
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/calendar/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block card :title="t('basicUsage')">
     <van-cell
       is-link
@@ -117,7 +116,6 @@
     :first-day-of-week="firstDayOfWeek"
     @confirm="onConfirm"
   />
-  </demo-section>
 </template>
 
 <script>

src/card/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('basicUsage')">
     <van-card
       num="2"
@@ -53,7 +52,6 @@
       </template>
     </van-card>
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/cell/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('basicUsage')">
     <van-cell-group>
       <van-cell :title="t('cell')" :value="t('content')" />
@@ -73,7 +72,6 @@
       :label="t('desc')"
     />
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/checkbox/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('basicUsage')">
     <van-checkbox v-model="checkbox1">{{ t('checkbox') }}</van-checkbox>
   </demo-block>
@@ -102,7 +101,6 @@
       </van-cell-group>
     </van-checkbox-group>
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/circle/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('basicUsage')">
     <van-circle
       v-model:current-rate="currentRate1"
@@ -66,7 +65,6 @@
       @click="reduce"
     />
   </div>
-  </demo-section>
 </template>
 
 <script>

src/col/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('basicUsage')">
     <van-row>
       <van-col span="8">span: 8</van-col>
@@ -54,7 +53,6 @@
       <van-col span="6">span: 6</van-col>
     </van-row>
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/collapse/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('basicUsage')">
     <van-collapse v-model="active1">
       <van-collapse-item :title="t('title') + 1">
@@ -59,7 +58,6 @@
       </van-collapse-item>
     </van-collapse>
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/contact-card/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('basicUsage')">
     <van-contact-card
       :type="cardType"
@@ -39,7 +38,6 @@
       :editable="false"
     />
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/count-down/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('basicUsage')">
     <van-count-down :time="time" />
   </demo-block>
@@ -35,15 +34,10 @@
     />
     <van-grid clickable :column-num="3">
       <van-grid-item icon="play-circle-o" :text="t('start')" @click="start" />
-        <van-grid-item
+      <van-grid-item icon="pause-circle-o" :text="t('pause')" @click="pause" />
-          icon="pause-circle-o"
-          :text="t('pause')"
-          @click="pause"
-        />
       <van-grid-item icon="replay" :text="t('reset')" @click="reset" />
     </van-grid>
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/coupon-list/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('basicUsage')">
     <van-coupon-cell
       :coupons="coupons"
@@ -22,7 +21,6 @@
       />
     </van-popup>
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/datetime-picker/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block card :title="t('dateType')">
     <van-datetime-picker
       v-model="value.date"
@@ -82,7 +81,6 @@
       :formatter="formatter"
     />
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/dialog/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block card :title="t('basicUsage')">
     <van-cell is-link :title="t('alert1')" @click="onClickAlert" />
     <van-cell is-link :title="t('alert2')" @click="onClickAlert2" />
@@ -26,7 +25,6 @@
       <img :src="image" />
     </van-dialog>
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/divider/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('basicUsage')">
     <van-divider />
   </demo-block>
@@ -27,13 +26,10 @@
   </demo-block>
 
   <demo-block :title="t('customStyle')">
-      <van-divider
+    <van-divider :style="{ borderColor: BLUE, color: BLUE, padding: '0 16px' }">
-        :style="{ borderColor: BLUE, color: BLUE, padding: '0 16px' }"
-      >
       {{ t('text') }}
     </van-divider>
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/dropdown-menu/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('basicUsage')">
     <van-dropdown-menu>
       <van-dropdown-item v-model="value1" :options="option1" />
@@ -56,7 +55,6 @@
       <van-dropdown-item v-model="value2" disabled :options="option2" />
     </van-dropdown-menu>
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/empty/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('basicUsage')">
     <van-empty :description="t('description')" />
   </demo-block>
@@ -33,7 +32,6 @@
       </van-button>
     </van-empty>
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/field/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <basic-usage />
   <custom-type />
   <disabled />
@@ -10,7 +9,6 @@
   <autosize />
   <show-word-limit />
   <input-align />
-  </demo-section>
 </template>
 
 <script>

src/form/demo/FieldTypeArea.vue

@@ -7,14 +7,8 @@
     :model-value="value"
     :placeholder="t('placeholder')"
     @click="showArea = true"
-  >
+  />
-    <template #extra>
+  <van-popup v-model:show="showArea" round position="bottom" teleport="body">
-      <van-popup
-        v-model:show="showArea"
-        round
-        position="bottom"
-        teleport="body"
-      >
     <van-area
       :area-list="t('areaList')"
       @confirm="onConfirm"
@@ -22,8 +16,6 @@
     />
   </van-popup>
 </template>
-  </van-field>
-</template>
 
 <script>
 import AreaList from '../../area/demo/area';

src/form/demo/FieldTypeCalendar.vue

@@ -7,8 +7,7 @@
     :model-value="value"
     :placeholder="t('placeholder')"
     @click="showCalendar = true"
-  >
+  />
-    <template #extra>
   <van-calendar
     v-model:show="showCalendar"
     round
@@ -16,8 +15,6 @@
     @confirm="onConfirm"
   />
 </template>
-  </van-field>
-</template>
 
 <script>
 export default {

src/form/demo/FieldTypeDatetimePicker.vue

@@ -7,23 +7,11 @@
     :model-value="value"
     :placeholder="t('placeholder')"
     @click="showPicker = true"
-  >
-    <template #extra>
-      <van-popup
-        v-model:show="showPicker"
-        round
-        position="bottom"
-        teleport="body"
-      >
-        <van-datetime-picker
-          type="time"
-          @confirm="onConfirm"
-          @cancel="onCancel"
   />
+  <van-popup v-model:show="showPicker" round position="bottom" teleport="body">
+    <van-datetime-picker type="time" @confirm="onConfirm" @cancel="onCancel" />
   </van-popup>
 </template>
-  </van-field>
-</template>
 
 <script>
 export default {

src/form/demo/FieldTypePicker.vue

@@ -7,14 +7,8 @@
     :model-value="value"
     :placeholder="t('placeholder')"
     @click="showPicker = true"
-  >
+  />
-    <template #extra>
+  <van-popup v-model:show="showPicker" round position="bottom" teleport="body">
-      <van-popup
-        v-model:show="showPicker"
-        round
-        position="bottom"
-        teleport="body"
-      >
     <van-picker
       :columns="t('textColumns')"
       @confirm="onConfirm"
@@ -22,8 +16,6 @@
     />
   </van-popup>
 </template>
-  </van-field>
-</template>
 
 <script>
 export default {

src/form/demo/index.vue

@@ -1,9 +1,7 @@
 <template>
-  <demo-section>
   <basic-usage />
   <validate-rules />
   <field-type />
-  </demo-section>
 </template>
 
 <script>

src/grid/demo/index.vue

@@ -1,69 +1,39 @@
 <template>
-  <demo-section>
   <demo-block :title="t('basicUsage')">
     <van-grid>
-        <van-grid-item
+      <van-grid-item v-for="i in 4" :key="i" icon="photo-o" :text="t('text')" />
-          v-for="i in 4"
-          :key="i"
-          icon="photo-o"
-          :text="t('text')"
-        />
     </van-grid>
   </demo-block>
 
   <demo-block :title="t('columnNum')">
     <van-grid :column-num="3">
-        <van-grid-item
+      <van-grid-item v-for="i in 6" :key="i" icon="photo-o" :text="t('text')" />
-          v-for="i in 6"
-          :key="i"
-          icon="photo-o"
-          :text="t('text')"
-        />
     </van-grid>
   </demo-block>
 
   <demo-block :title="t('customContent')">
     <van-grid :border="false" :column-num="3">
       <van-grid-item>
-          <van-image
+        <van-image fit="contain" src="https://img.yzcdn.cn/vant/apple-1.jpg" />
-            fit="contain"
-            src="https://img.yzcdn.cn/vant/apple-1.jpg"
-          />
       </van-grid-item>
       <van-grid-item>
-          <van-image
+        <van-image fit="contain" src="https://img.yzcdn.cn/vant/apple-2.jpg" />
-            fit="contain"
-            src="https://img.yzcdn.cn/vant/apple-2.jpg"
-          />
       </van-grid-item>
       <van-grid-item>
-          <van-image
+        <van-image fit="contain" src="https://img.yzcdn.cn/vant/apple-3.jpg" />
-            fit="contain"
-            src="https://img.yzcdn.cn/vant/apple-3.jpg"
-          />
       </van-grid-item>
     </van-grid>
   </demo-block>
 
   <demo-block :title="t('square')">
     <van-grid square>
-        <van-grid-item
+      <van-grid-item v-for="i in 8" :key="i" icon="photo-o" :text="t('text')" />
-          v-for="i in 8"
-          :key="i"
-          icon="photo-o"
-          :text="t('text')"
-        />
     </van-grid>
   </demo-block>
 
   <demo-block :title="t('gutter')">
     <van-grid :gutter="10">
-        <van-grid-item
+      <van-grid-item v-for="i in 8" :key="i" icon="photo-o" :text="t('text')" />
-          v-for="i in 8"
-          :key="i"
-          icon="photo-o"
-          :text="t('text')"
-        />
     </van-grid>
   </demo-block>
 
@@ -92,7 +62,6 @@
       <van-grid-item icon="search" :text="t('text')" badge="99+" />
     </van-grid>
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/icon/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <van-tabs v-model="tab" sticky>
     <van-tab :title="t('demo')">
       <demo-block :title="t('basicUsage')">
@@ -92,7 +91,6 @@
       </van-row>
     </van-tab>
   </van-tabs>
-  </demo-section>
 </template>
 
 <script>

src/image-preview/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block card :title="t('basicUsage')">
     <van-cell is-link @click="showImagePreview()">
       {{ t('showImages') }}
@@ -28,15 +27,10 @@
     <van-cell is-link @click="componentCall">
       {{ t('componentCall') }}
     </van-cell>
-      <van-image-preview
+    <van-image-preview v-model:show="show" :images="images" @change="onChange">
-        v-model:show="show"
-        :images="images"
-        @change="onChange"
-      >
       <template #index>{{ t('index', index) }}</template>
     </van-image-preview>
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/image/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('basicUsage')">
     <van-row>
       <van-image width="100" height="100" :src="image" />
@@ -57,7 +56,6 @@
       </van-col>
     </van-row>
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/index-bar/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <van-tabs v-model="activeTab">
     <van-tab :title="t('basicUsage')">
       <van-index-bar>
@@ -25,7 +24,6 @@
       </van-index-bar>
     </van-tab>
   </van-tabs>
-  </demo-section>
 </template>
 
 <script>

src/lazyload/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('basicUsage')">
     <img v-for="img in imageList" :key="img" v-lazy="img" />
   </demo-block>
@@ -17,7 +16,6 @@
       <img v-for="img in componentImageList" :key="img" v-lazy="img" />
     </lazy-component>
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/list/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <van-tabs>
     <van-tab :title="t('basicUsage')">
       <van-list
@@ -37,7 +36,6 @@
       </van-pull-refresh>
     </van-tab>
   </van-tabs>
-  </demo-section>
 </template>
 
 <script>

src/loading/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('type')">
     <van-loading />
     <van-loading type="spinner" />
@@ -26,7 +25,6 @@
       {{ t('loading') }}
     </van-loading>
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/nav-bar/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('basicUsage')">
     <van-nav-bar
       :title="t('title')"
@@ -18,7 +17,6 @@
       </template>
     </van-nav-bar>
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/notice-bar/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('basicUsage')">
     <van-notice-bar :text="t('text')" scrollable left-icon="volume-o" />
   </demo-block>
@@ -41,7 +40,6 @@
       </van-swipe>
     </van-notice-bar>
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/notify/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block card :title="t('basicUsage')">
     <van-cell is-link :title="t('basicUsage')" @click="showNotify" />
   </demo-block>
@@ -21,18 +20,13 @@
   </demo-block>
 
   <demo-block card :title="t('componentCall')">
-      <van-cell
+    <van-cell is-link :title="t('componentCall')" @click="showComponentCall" />
-        is-link
-        :title="t('componentCall')"
-        @click="showComponentCall"
-      />
 
     <van-notify v-model:show="show" type="success">
       <van-icon name="bell" style="margin-right: 4px;" />
       <span>{{ t('content') }}</span>
     </van-notify>
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/number-keyboard/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <van-cell is-link @touchstart.stop="keyboard = 'default'">
     {{ t('button1') }}
   </van-cell>
@@ -76,7 +75,6 @@
     maxlength="6"
     @blur="keyboard = ''"
   />
-  </demo-section>
 </template>
 
 <script>

src/overlay/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('basicUsage')">
     <van-button
       type="primary"
@@ -7,7 +6,6 @@
       style="margin-left: 16px;"
       @click="show = true"
     />
-
     <van-overlay :show="show" @click="show = false" />
   </demo-block>
 
@@ -18,14 +16,12 @@
       style="margin-left: 16px;"
       @click="showEmbedded = true"
     />
-
     <van-overlay :show="showEmbedded" @click="showEmbedded = false">
       <div class="wrapper">
         <div class="block" />
       </div>
     </van-overlay>
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/pagination/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('basicUsage')">
     <van-pagination
       v-model="currentPage1"
@@ -47,7 +46,6 @@
       <template #page="{ text }">{{ text }}</template>
     </van-pagination>
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/password-input/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block ref="basicUsage" :title="t('basicUsage')">
     <van-password-input
       :value="value.basicUsage"
@@ -51,7 +50,6 @@
     @input="onInput"
     @delete="onDelete"
   />
-  </demo-section>
 </template>
 
 <script>

src/picker/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block card :title="t('basicUsage')">
     <van-picker
       :title="t('title')"
@@ -65,7 +64,6 @@
       />
     </van-popup>
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/popup/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block card :title="t('basicUsage')">
     <van-cell :title="t('buttonBasic')" is-link @click="showBasic = true" />
     <van-popup v-model:show="showBasic" :style="{ padding: '30px 50px' }">
@@ -85,18 +84,13 @@
   </demo-block>
 
   <demo-block card v-if="!isWeapp" :title="t('teleport')">
-      <van-cell
+    <van-cell :title="t('teleport')" is-link @click="showGetContainer = true" />
-        :title="t('teleport')"
-        is-link
-        @click="showGetContainer = true"
-      />
     <van-popup
       v-model:show="showGetContainer"
       teleport="body"
       :style="{ padding: '30px 50px' }"
     />
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/progress/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('basicUsage')">
     <van-progress :percentage="50" />
   </demo-block>
@@ -13,11 +12,7 @@
   </demo-block>
 
   <demo-block :title="t('title3')">
-      <van-progress
+    <van-progress color="#f2826a" :percentage="25" :pivot-text="t('orange')" />
-        color="#f2826a"
-        :percentage="25"
-        :pivot-text="t('orange')"
-      />
     <van-progress color="#ee0a24" :percentage="50" :pivot-text="t('red')" />
     <van-progress
       :percentage="75"
@@ -26,7 +21,6 @@
       color="linear-gradient(to right, #be99ff, #7232dd)"
     />
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/pull-refresh/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section name="pull-refresh">
   <van-tabs>
     <van-tab :title="t('basicUsage')">
       <van-pull-refresh v-model="isLoading" @refresh="onRefresh(true)">
@@ -40,7 +39,6 @@
       </van-pull-refresh>
     </van-tab>
   </van-tabs>
-  </demo-section>
 </template>
 
 <script>

src/radio/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('basicUsage')">
     <van-radio-group v-model="radio1" class="demo-radio-group">
       <van-radio name="1">{{ t('radio') }} 1</van-radio>
@@ -94,7 +93,6 @@
       </van-cell-group>
     </van-radio-group>
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/rate/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('basicUsage')">
     <van-rate v-model="value1" />
   </demo-block>
@@ -43,7 +42,6 @@
   <demo-block v-if="!isWeapp" :title="t('changeEvent')">
     <van-rate v-model="value7" @change="onChange" />
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/search/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('basicUsage')">
     <van-search v-model="value1" :placeholder="t('placeholder')" />
   </demo-block>
@@ -50,7 +49,6 @@
       </template>
     </van-search>
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/share-sheet/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block card :title="t('basicUsage')">
     <van-cell is-link :title="t('showSheet')" @click="show.basic = true" />
     <van-share-sheet
@@ -11,11 +10,7 @@
   </demo-block>
 
   <demo-block card :title="t('multiLine')">
-      <van-cell
+    <van-cell is-link :title="t('showSheet')" @click="show.multiLine = true" />
-        is-link
-        :title="t('showSheet')"
-        @click="show.multiLine = true"
-      />
     <van-share-sheet
       v-model:show="show.multiLine"
       :title="t('title')"
@@ -25,11 +20,7 @@
   </demo-block>
 
   <demo-block card :title="t('customIcon')">
-      <van-cell
+    <van-cell is-link :title="t('showSheet')" @click="show.customIcon = true" />
-        is-link
-        :title="t('showSheet')"
-        @click="show.customIcon = true"
-      />
     <van-share-sheet
       v-model:show="show.customIcon"
       :options="customIconOptions"
@@ -47,7 +38,6 @@
       @select="onSelect"
     />
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/sidebar/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <van-grid :column-num="2" :border="false">
     <van-grid-item>
       <h3 class="demo-sidebar-title">{{ t('basicUsage') }}</h3>
@@ -37,7 +36,6 @@
       </van-sidebar>
     </van-grid-item>
   </van-grid>
-  </demo-section>
 </template>
 
 <script>

src/skeleton/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('basicUsage')">
     <van-skeleton title :row="3" />
   </demo-block>
@@ -20,7 +19,6 @@
       </div>
     </van-skeleton>
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/slider/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('title1')">
     <van-slider v-model="value1" @change="onChange" />
   </demo-block>
@@ -49,7 +48,6 @@
       />
     </div>
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/stepper/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <van-cell center :title="t('basicUsage')">
     <van-stepper v-model="stepper1" />
   </van-cell>
@@ -44,7 +43,6 @@
       disable-input
     />
   </van-cell>
-  </demo-section>
 </template>
 
 <script>

src/steps/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('basicUsage')">
     <van-steps :active="active">
       <van-step>{{ t('step1') }}</van-step>
@@ -41,7 +40,6 @@
       </van-step>
     </van-steps>
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/sticky/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('basicUsage')">
     <van-sticky>
       <van-button type="primary" style="margin-left: 15px;">
@@ -25,7 +24,6 @@
       </van-sticky>
     </div>
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/style/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('ellipsis')">
     <div class="van-ellipsis">{{ t('text1') }}</div>
     <div class="van-multi-ellipsis--l2">{{ t('text2') }}</div>
@@ -14,17 +13,12 @@
     <van-cell is-link title="Slide Up" @click="animate('van-slide-up')" />
     <van-cell is-link title="Slide Down" @click="animate('van-slide-down')" />
     <van-cell is-link title="Slide Left" @click="animate('van-slide-left')" />
-      <van-cell
+    <van-cell is-link title="Slide Right" @click="animate('van-slide-right')" />
-        is-link
-        title="Slide Right"
-        @click="animate('van-slide-right')"
-      />
   </demo-block>
 
   <transition :name="transitionName">
     <div v-show="show" class="demo-animate-block" />
   </transition>
-  </demo-section>
 </template>
 
 <script>

src/submit-bar/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('basicUsage')">
     <van-submit-bar
       :price="3050"
@@ -43,7 +42,6 @@
       </template>
     </van-submit-bar>
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/swipe-cell/demo/index.vue

@@ -1,6 +1,4 @@
 <template>
-  <div>
-    <demo-section>
   <demo-block :title="t('basicUsage')">
     <van-swipe-cell>
       <template #left>
@@ -45,8 +43,6 @@
       </template>
     </van-swipe-cell>
   </demo-block>
-    </demo-section>
-  </div>
 </template>
 
 <script>

src/swipe/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('basicUsage')">
     <van-swipe :autoplay="3000" indicator-color="white">
       <van-swipe-item>1</van-swipe-item>
@@ -64,7 +63,6 @@
       </template>
     </van-swipe>
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/switch/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('basicUsage')">
     <van-switch v-model="checked" />
   </demo-block>
@@ -35,7 +34,6 @@
       </template>
     </van-cell>
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/tab/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('basicUsage')">
     <van-tabs v-model:active="active">
       <van-tab :title="t('tab') + index" v-for="index in tabs" :key="index">
@@ -101,7 +100,6 @@
       </van-tab>
     </van-tabs>
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/tabbar/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('basicUsage')">
     <van-tabbar v-model="active">
       <van-tabbar-item icon="home-o">{{ t('tab') }}</van-tabbar-item>
@@ -53,11 +52,7 @@
   </demo-block>
 
   <demo-block :title="t('customColor')">
-      <van-tabbar
+    <van-tabbar v-model="active4" active-color="#07c160" inactive-color="#000">
-        v-model="active4"
-        active-color="#07c160"
-        inactive-color="#000"
-      >
       <van-tabbar-item icon="home-o">{{ t('tab') }}</van-tabbar-item>
       <van-tabbar-item icon="search">{{ t('tab') }}</van-tabbar-item>
       <van-tabbar-item icon="friends-o">{{ t('tab') }}</van-tabbar-item>
@@ -73,7 +68,6 @@
       <van-tabbar-item icon="setting-o">{{ t('tab') + 4 }}</van-tabbar-item>
     </van-tabbar>
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/tag/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block card :title="t('basicUsage')">
     <van-cell :title="`primary ${t('type')}`">
       <van-tag type="primary">{{ t('tag') }}</van-tag>
@@ -61,7 +60,6 @@
       <van-tag color="#7232dd" plain>{{ t('tag') }}</van-tag>
     </van-cell>
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/toast/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block card :title="t('basicUsage')">
     <van-cell is-link :title="t('title1')" @click="$toast(t('text'))" />
     <van-cell is-link :title="t('title2')" @click="showLoadingToast()" />
@@ -29,7 +28,6 @@
       @click="showCustomizedToast"
     />
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/tree-select/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('radioMode')">
     <van-tree-select
       v-model:active-id="activeId"
@@ -45,7 +44,6 @@
       :items="badgeItems"
     />
   </demo-block>
-  </demo-section>
 </template>
 
 <script>

src/uploader/demo/index.vue

@@ -1,5 +1,4 @@
 <template>
-  <demo-section>
   <demo-block :title="t('basicUsage')">
     <van-uploader :after-read="afterRead" />
   </demo-block>
@@ -48,7 +47,6 @@
   <demo-block :title="t('disabled')">
     <van-uploader :after-read="afterRead" disabled />
   </demo-block>
-  </demo-section>
 </template>
 
 <script>