From abdc38eeee5fe7bb1386b3483255a8f245045766 Mon Sep 17 00:00:00 2001
From: linrz <linrz@lastwhisper.cn>
Date: Sun, 22 Dec 2019 20:43:31 +0800
Subject: [PATCH] docs: add radio shape usage

---
 src/radio/README.md                            |  9 +++++++++
 src/radio/README.zh-CN.md                      | 11 +++++++++++
 src/radio/demo/index.vue                       | 10 ++++++++++
 src/radio/test/__snapshots__/demo.spec.js.snap | 12 ++++++++++++
 4 files changed, 42 insertions(+)

diff --git a/src/radio/README.md b/src/radio/README.md
index e671779ab..c6fe97b4b 100644
--- a/src/radio/README.md
+++ b/src/radio/README.md
@@ -51,6 +51,15 @@ export default {
 </van-radio-group>
 ```
 
+### Custom Shape
+
+```html
+<van-radio-group v-model="radio">
+  <van-radio name="1" shape="square">Radio 1</van-radio>
+  <van-radio name="2" shape="square">Radio 2</van-radio>
+</van-radio-group>
+```
+
 ### Custom Color
 
 ```html
diff --git a/src/radio/README.zh-CN.md b/src/radio/README.zh-CN.md
index 5d3cdbcfd..4ee25881e 100644
--- a/src/radio/README.zh-CN.md
+++ b/src/radio/README.zh-CN.md
@@ -55,6 +55,17 @@ export default {
 </van-radio-group>
 ```
 
+### 自定义形状
+
+通过`square`属性设置选中状态的图标颜色
+
+```html
+<van-radio-group v-model="radio">
+  <van-radio name="1" shape="square">单选框 1</van-radio>
+  <van-radio name="2" shape="square">单选框 2</van-radio>
+</van-radio-group>
+```
+
 ### 自定义颜色
 
 通过`checked-color`属性设置选中状态的图标颜色
diff --git a/src/radio/demo/index.vue b/src/radio/demo/index.vue
index f6f01bfa6..a60bab475 100644
--- a/src/radio/demo/index.vue
+++ b/src/radio/demo/index.vue
@@ -21,6 +21,13 @@
       </van-radio-group>
     </demo-block>
 
+    <demo-block :title="$t('customShape')">
+      <van-radio-group v-model="radioShape" class="demo-radio-group">
+        <van-radio name="1" shape="square">{{ $t('radio') }} 1</van-radio>
+        <van-radio name="2" shape="square">{{ $t('radio') }} 2</van-radio>
+      </van-radio-group>
+    </demo-block>
+
     <demo-block :title="$t('customColor')">
       <van-radio-group v-model="radio3" class="demo-radio-group">
         <van-radio name="1" checked-color="#07c160">{{ $t('radio') }} 1</van-radio>
@@ -77,6 +84,7 @@ export default {
       customIcon: '自定义图标',
       customIconSize: '自定义大小',
       customColor: '自定义颜色',
+      customShape: '自定义形状',
       withCell: '与 Cell 组件一起使用',
       disabledLabelClick: '禁用单选框文本点击'
     },
@@ -87,6 +95,7 @@ export default {
       customIcon: 'Custom Icon',
       customIconSize: 'Custom Icon Size',
       customColor: 'Custom Color',
+      customShape: 'Custom Shape',
       withCell: 'Inside a Cell',
       disabledLabelClick: 'Disable the click event of label'
     }
@@ -101,6 +110,7 @@ export default {
       radio5: '1',
       radioLabel: '1',
       radioIconSize: '1',
+      radioShape: '1',
       icon: {
         active: 'https://img.yzcdn.cn/vant/user-active.png',
         inactive: 'https://img.yzcdn.cn/vant/user-inactive.png'
diff --git a/src/radio/test/__snapshots__/demo.spec.js.snap b/src/radio/test/__snapshots__/demo.spec.js.snap
index 3643e072e..b6f61571b 100644
--- a/src/radio/test/__snapshots__/demo.spec.js.snap
+++ b/src/radio/test/__snapshots__/demo.spec.js.snap
@@ -38,6 +38,18 @@ exports[`renders demo correctly 1`] = `
       </div>
     </div>
   </div>
+  <div>
+    <div role="radiogroup" class="demo-radio-group van-radio-group">
+      <div role="radio" tabindex="0" aria-checked="true" class="van-radio">
+        <div class="van-radio__icon van-radio__icon--square van-radio__icon--checked"><i class="van-icon van-icon-success">
+            <!----></i></div><span class="van-radio__label">单选框 1</span>
+      </div>
+      <div role="radio" tabindex="-1" aria-checked="false" class="van-radio">
+        <div class="van-radio__icon van-radio__icon--square"><i class="van-icon van-icon-success">
+            <!----></i></div><span class="van-radio__label">单选框 2</span>
+      </div>
+    </div>
+  </div>
   <div>
     <div role="radiogroup" class="demo-radio-group van-radio-group">
       <div role="radio" tabindex="0" aria-checked="true" class="van-radio">