From c76c61b8e2a5491dd3ad4e2b9922d733e46ec6ef Mon Sep 17 00:00:00 2001
From: rex <rexkaneki@gmail.com>
Date: Wed, 4 Dec 2019 17:53:00 +0800
Subject: [PATCH] feat(Overlay): add default slot (#2466)

fix #2449
---
 example/pages/overlay/index.js   | 17 ++++++++--
 example/pages/overlay/index.wxml | 13 +++++++-
 example/pages/overlay/index.wxss | 13 +++++++-
 packages/overlay/README.md       | 55 ++++++++++++++++++++++++++++++++
 packages/overlay/index.wxml      |  4 ++-
 5 files changed, 97 insertions(+), 5 deletions(-)

diff --git a/example/pages/overlay/index.js b/example/pages/overlay/index.js
index e6e1ee61..76454f4a 100644
--- a/example/pages/overlay/index.js
+++ b/example/pages/overlay/index.js
@@ -2,12 +2,25 @@ import Page from '../../common/page';
 
 Page({
   data: {
-    show: false
+    show: false,
+    showEmbedded: false
   },
+
   onClickShow() {
     this.setData({ show: true });
   },
+
   onClickHide() {
     this.setData({ show: false });
-  }
+  },
+
+  onClickShowEmbedded() {
+    this.setData({ showEmbedded: true });
+  },
+
+  onClickHideEmbedded() {
+    this.setData({ showEmbedded: false });
+  },
+
+  noop() {}
 });
diff --git a/example/pages/overlay/index.wxml b/example/pages/overlay/index.wxml
index 29592340..2beb4efe 100644
--- a/example/pages/overlay/index.wxml
+++ b/example/pages/overlay/index.wxml
@@ -2,5 +2,16 @@
   <van-button type="primary" bind:click="onClickShow">
     显示遮罩层
   </van-button>
-  <van-overlay show="{{ show }}" bind:click="onClickHide"/>
+  <van-overlay show="{{ show }}" bind:click="onClickHide" />
+</demo-block>
+
+<demo-block title="嵌入内容" padding>
+  <van-button type="primary" bind:click="onClickShowEmbedded">
+    嵌入内容
+  </van-button>
+  <van-overlay show="{{ showEmbedded }}" bind:click="onClickHideEmbedded">
+    <view class="wrapper">
+      <div class="block" catch:tap="noop" />
+    </view>
+  </van-overlay>
 </demo-block>
diff --git a/example/pages/overlay/index.wxss b/example/pages/overlay/index.wxss
index 70ef6a9d..a4a420c7 100644
--- a/example/pages/overlay/index.wxss
+++ b/example/pages/overlay/index.wxss
@@ -1 +1,12 @@
-/* pages/overlay/index.wxss */
\ No newline at end of file
+.wrapper {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 100%;
+}
+
+.block {
+  width: 120px;
+  height: 120px;
+  background-color: #fff;
+}
diff --git a/packages/overlay/README.md b/packages/overlay/README.md
index f9a51834..2a984987 100644
--- a/packages/overlay/README.md
+++ b/packages/overlay/README.md
@@ -28,15 +28,63 @@ Page({
   data: {
     show: false
   },
+
   onClickShow() {
     this.setData({ show: true });
   },
+
   onClickHide() {
     this.setData({ show: false });
   }
 });
 ```
 
+### 嵌入内容
+
+通过默认插槽可以在遮罩层上嵌入任意内容
+
+```html
+<van-button type="primary" bind:click="onClickShow">嵌入内容</van-button>
+<van-overlay show="{{ show }}" bind:click="onClickHide">
+  <view class="wrapper">
+    <view class="block" catch:tap="noop" />
+  </view>
+</van-overlay>
+```
+
+```js
+Page({
+  data: {
+    show: false
+  },
+
+  onClickShow() {
+    this.setData({ show: true });
+  },
+
+  onClickHide() {
+    this.setData({ show: false });
+  },
+
+  noop() {}
+});
+```
+
+```css
+.wrapper {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 100%;
+}
+
+.block {
+  width: 120px;
+  height: 120px;
+  background-color: #fff;
+}
+```
+
 ### Props
 
 | 参数 | 说明 | 类型 | 默认值 | 版本 |
@@ -52,3 +100,10 @@ Page({
 | 事件名 | 说明 | 回调参数 |
 |-----------|-----------|-----------|
 | bind:click | 点击时触发 | - |
+
+### Slots
+
+| 名称 | 说明 |
+|------|------|
+| - | 默认插槽，用于在遮罩层上方嵌入内容 |
+
diff --git a/packages/overlay/index.wxml b/packages/overlay/index.wxml
index d3e2b5f0..9212348b 100644
--- a/packages/overlay/index.wxml
+++ b/packages/overlay/index.wxml
@@ -5,4 +5,6 @@
   duration="{{ duration }}"
   bind:tap="onClick"
   catch:touchmove="noop"
-/>
+>
+  <slot></slot>
+</van-transition>