diff --git a/components/popconfirm/demo/index.vue b/components/popconfirm/demo/index.vue
index ce41e9a3a..2fad3f2a7 100644
--- a/components/popconfirm/demo/index.vue
+++ b/components/popconfirm/demo/index.vue
@@ -15,7 +15,7 @@ const md = {
 
   目标元素的操作需要用户进一步的确认时，在目标元素附近弹出浮层提示，询问用户。
 
-和 'confirm' 弹出的全屏居中模态对话框相比，交互形式更轻量。。
+和 'confirm' 弹出的全屏居中模态对话框相比，交互形式更轻量。
             ## 代码演示`,
   us: `# Popconfirm
 
diff --git a/components/popconfirm/index.en-US.md b/components/popconfirm/index.en-US.md
index 38de143fc..66115882b 100644
--- a/components/popconfirm/index.en-US.md
+++ b/components/popconfirm/index.en-US.md
@@ -2,8 +2,8 @@
 
 | Param | Description | Type | Default value |
 | ----- | ----------- | ---- | ------------- |
-| cancelText | text of the Cancel button | string | `Cancel` |
-| okText | text of the Confirm button | string | `Confirm` |
+| cancelText | text of the Cancel button | string\|slot | `Cancel` |
+| okText | text of the Confirm button | string\|slot | `Confirm` |
 | okType | Button `type` of the Confirm button | string | `primary` |
 | title | title of the confirmation box | string\|slot | - |
 
diff --git a/components/popconfirm/index.zh-CN.md b/components/popconfirm/index.zh-CN.md
index 823cba49e..c8a536e1a 100644
--- a/components/popconfirm/index.zh-CN.md
+++ b/components/popconfirm/index.zh-CN.md
@@ -2,8 +2,8 @@
 
 | 参数 | 说明 | 类型 | 默认值 |
 | --- | --- | --- | --- |
-| cancelText | 取消按钮文字 | string | 取消 |
-| okText | 确认按钮文字 | string | 确定 |
+| cancelText | 取消按钮文字 | string\|slot | 取消 |
+| okText | 确认按钮文字 | string\|slot | 确定 |
 | okType | 确认按钮类型 | string | primary |
 | title | 确认框的描述 | string\|slot | 无 |
 
diff --git a/components/tooltip/Tooltip.jsx b/components/tooltip/Tooltip.jsx
index 7f4c55955..91e67a900 100644
--- a/components/tooltip/Tooltip.jsx
+++ b/components/tooltip/Tooltip.jsx
@@ -147,7 +147,7 @@ export default {
 
   render (h) {
     const { $props, $data, $slots } = this
-    const { prefixCls, openClassName, getPopupContainer, getTooltipContainer } = $props
+    const { prefixCls, openClassName, getPopupContainer } = $props
     const children = ($slots.default || []).filter(c => c.tag || c.text.trim() !== '')[0]
     let sVisible = $data.sVisible
     // Hide tooltip when there is no title
@@ -164,7 +164,7 @@ export default {
     const tooltipProps = {
       props: {
         ...$props,
-        getTooltipContainer: getPopupContainer || getTooltipContainer,
+        getTooltipContainer: getPopupContainer,
         builtinPlacements: this.getPlacements(),
         visible: sVisible,
       },
diff --git a/components/tooltip/demo/arrow-point-at-center.md b/components/tooltip/demo/arrow-point-at-center.md
new file mode 100644
index 000000000..efa0e552b
--- /dev/null
+++ b/components/tooltip/demo/arrow-point-at-center.md
@@ -0,0 +1,22 @@
+<cn>
+#### 箭头指向
+设置了 `arrowPointAtCenter` 后，箭头将指向目标元素的中心。
+</cn>
+
+<us>
+#### Arrow pointing at the center
+By specifying `arrowPointAtCenter` prop, the arrow will point to the center of the target element.
+</us>
+
+```html
+<template>
+  <div>
+    <a-tooltip placement="topLeft" title="Prompt Text">
+      <a-button>Align edge / 边缘对齐</a-button>
+    </a-tooltip>
+    <a-tooltip placement="topLeft" title="Prompt Text" arrowPointAtCenter>
+      <a-button>Arrow points to center / 箭头指向中心</a-button>
+    </a-tooltip>
+  </div>
+</template>
+```
diff --git a/components/tooltip/demo/arrow-point-at-center.vue b/components/tooltip/demo/arrow-point-at-center.vue
deleted file mode 100644
index 58905f332..000000000
--- a/components/tooltip/demo/arrow-point-at-center.vue
+++ /dev/null
@@ -1,14 +0,0 @@
-<template>
-<div>
-<md>
-## 箭头指向
-设置了 `arrowPointAtCenter` 后，箭头将指向目标元素的中心。
-</md>
-  <a-tooltip placement="topLeft" title="Prompt Text">
-    <a-button>Align edge / 边缘对齐</a-button>
-  </a-tooltip>
-  <a-tooltip placement="topLeft" title="Prompt Text" arrowPointAtCenter>
-    <a-button>Arrow points to center / 箭头指向中心</a-button>
-  </a-tooltip>
-</div>
-</template>
diff --git a/components/tooltip/demo/auto-adjust-overflow.vue b/components/tooltip/demo/auto-adjust-overflow.md
similarity index 51%
rename from components/tooltip/demo/auto-adjust-overflow.vue
rename to components/tooltip/demo/auto-adjust-overflow.md
index d53416155..2f5fceb6f 100644
--- a/components/tooltip/demo/auto-adjust-overflow.vue
+++ b/components/tooltip/demo/auto-adjust-overflow.md
@@ -1,23 +1,26 @@
-<template>
-<div>
-  <md>
-  ## 自动调整位置
-  气泡框不可见时自动调整位置。
-  </md>
-  <div :style="wrapStyles">
-    <Tooltip placement="left" title="Prompt Text" :getPopupContainer="getPopupContainer">
-      <a-button>Adjust automatically / 自动调整</a-button>
-    </Tooltip>
-    <br />
-    <Tooltip placement="left" title="Prompt Text" :getPopupContainer="getPopupContainer" :autoAdjustOverflow="false">
-      <a-button>Ingore / 不处理</a-button>
-    </Tooltip>
-  </div>
-</div>
-</template>
+<cn>
+#### 自动调整位置
+气泡框不可见时自动调整位置
+</cn>
 
+<us>
+#### Adjust placement automatically
+Adjust popup placement automatically when popup is invisible
+</us>
+
+```html
+<template>
+  <div :style="wrapStyles">
+    <a-tooltip placement="left" title="Prompt Text" :getPopupContainer="getPopupContainer">
+      <a-button>Adjust automatically / 自动调整</a-button>
+    </a-tooltip>
+    <br />
+    <a-tooltip style="marginTop: 10px" placement="left" title="Prompt Text" :getPopupContainer="getPopupContainer" :autoAdjustOverflow="false">
+      <a-button>Ingore / 不处理</a-button>
+    </a-tooltip>
+  </div>
+</template>
 <script>
-import { Tooltip, Button } from 'antd'
 const wrapStyles = {
   overflow: 'hidden',
   position: 'relative',
@@ -35,9 +38,7 @@ export default {
       return trigger.parentElement
     },
   },
-  components: {
-    Tooltip,
-
-  },
 }
 </script>
+```
+
diff --git a/components/tooltip/demo/basic.md b/components/tooltip/demo/basic.md
new file mode 100644
index 000000000..f3148c49b
--- /dev/null
+++ b/components/tooltip/demo/basic.md
@@ -0,0 +1,21 @@
+<cn>
+#### 基本
+最简单的用法。
+</cn>
+
+<us>
+#### Basic
+The simplest usage.
+</us>
+
+```html
+<template>
+  <a-tooltip>
+    <template slot='title'>
+      prompt text
+    </template>
+    Tooltip will show when mouse enter.
+  </a-tooltip>
+</template>
+```
+
diff --git a/components/tooltip/demo/basic.vue b/components/tooltip/demo/basic.vue
deleted file mode 100644
index b60af9327..000000000
--- a/components/tooltip/demo/basic.vue
+++ /dev/null
@@ -1,23 +0,0 @@
-<template>
-<div>
-<md>
-## 基本
-最简单的用法。
-</md>
-<Tooltip>
-  <template slot='title'>
-    prompt text
-  </template>
-  Tooltip will show when mouse enter.
-</Tooltip>
-</div>
-</template>
-
-<script>
-import { Tooltip } from 'antd'
-export default {
-  components: {
-    Tooltip,
-  },
-}
-</script>
diff --git a/components/tooltip/demo/index.vue b/components/tooltip/demo/index.vue
index 306723e36..f2cba2ae4 100644
--- a/components/tooltip/demo/index.vue
+++ b/components/tooltip/demo/index.vue
@@ -1,30 +1,59 @@
-<template>
-  <div>
-    <h1>Basic</h1>
-    <Basic />
-    <h1>ArrowCenter</h1>
-    <ArrowCenter />
-    <h1>AutoAdjust</h1>
-    <AutoAdjust />
-    <h1>Placement</h1>
-    <Placement />
-  </div>
-</template>
 <script>
-import Basic from './basic'
-import ArrowCenter from './arrow-point-at-center'
-import AutoAdjust from './auto-adjust-overflow'
-import Placement from './placement'
+import Basic from './basic.md'
+import ArrowPointAtCenter from './arrow-point-at-center.md'
+import AutoAdjustOverflow from './auto-adjust-overflow.md'
+import Placement from './placement.md'
+import CN from '../index.zh-CN.md'
+import US from '../index.en-US.md'
+
+const md = {
+  cn: `# Tooltip
+
+  简单的文字提示气泡框。
+
+  ## 何时使用
+
+  鼠标移入则显示提示，移出消失，气泡浮层不承载复杂文本和操作。
+
+可用来代替系统默认的 'title' 提示，提供一个'按钮/文字/操作'的文案解释。
+            ## 代码演示`,
+  us: `# Tooltip
+
+  A simple text popup tip.
+
+  # When To Use
+
+  - The tip is shown on mouse enter, and is hidden on mouse leave. The Tooltip doesn't support complex text or operations.
+  - To provide an explanation of a 'button/text/operation'. It's often used instead of the html 'title' attribute.
+  ## Examples
+  `,
+}
 export default {
   category: 'Components',
   subtitle: '文字提示',
   type: 'Data Display',
   title: 'Tooltip',
-  components: {
-    Basic,
-    ArrowCenter,
-    AutoAdjust,
-    Placement,
+  render () {
+    return (
+      <div>
+        <md cn={md.cn} us={md.us}/>
+        <br/>
+        <Basic />
+        <br/>
+        <Placement />
+        <br/>
+        <ArrowPointAtCenter />
+        <br/>
+        <AutoAdjustOverflow />
+        <br/>
+        <api>
+          <template slot='cn'>
+            <CN/>
+          </template>
+          <US/>
+        </api>
+      </div>
+    )
   },
 }
 </script>
diff --git a/components/tooltip/demo/placement.md b/components/tooltip/demo/placement.md
new file mode 100644
index 000000000..52e346684
--- /dev/null
+++ b/components/tooltip/demo/placement.md
@@ -0,0 +1,117 @@
+<cn>
+#### 位置
+位置有 12 个方向。
+</cn>
+
+<us>
+#### Placement
+The ToolTip has 12 placements choice.
+</us>
+
+```html
+<template>
+  <div id="components-a-tooltip-demo-placement">
+    <div :style="{ marginLeft: `${buttonWidth}px`, whiteSpace: 'nowrap' }">
+      <a-popconfirm placement="topLeft" >
+        <template slot="title">
+          <span>prompt text</span>
+        </template>
+        <a-button>TL</a-button>
+      </a-popconfirm>
+      <a-popconfirm placement="top" >
+        <template slot="title">
+          <span>prompt text</span>
+        </template>
+        <a-button>Top</a-button>
+      </a-popconfirm>
+      <a-popconfirm placement="topRight" >
+        <template slot="title">
+          <span>prompt text</span>
+        </template>
+        <a-button>TR</a-button>
+      </a-popconfirm>
+    </div>
+    <div :style="{ width: `${buttonWidth}px`, float: 'left' }">
+      <a-popconfirm placement="leftTop" >
+        <template slot="title">
+          <span>prompt text</span>
+        </template>
+        <a-button>LT</a-button>
+      </a-popconfirm>
+      <a-popconfirm placement="left" >
+        <template slot="title">
+          <span>prompt text</span>
+        </template>
+        <a-button>Left</a-button>
+      </a-popconfirm>
+      <a-popconfirm placement="leftBottom" >
+        <template slot="title">
+          <span>prompt text</span>
+        </template>
+        <a-button>LB</a-button>
+      </a-popconfirm>
+    </div>
+    <div :style="{ width: `${buttonWidth}px`, marginLeft: `${buttonWidth * 4 + 24 }px`}">
+      <a-popconfirm placement="rightTop" >
+        <template slot="title">
+          <span>prompt text</span>
+        </template>
+        <a-button>RT</a-button>
+      </a-popconfirm>
+      <a-popconfirm placement="right" >
+        <template slot="title">
+          <span>prompt text</span>
+        </template>
+        <a-button>Right</a-button>
+      </a-popconfirm>
+      <a-popconfirm placement="rightBottom" >
+        <template slot="title">
+          <span>prompt text</span>
+        </template>
+        <a-button>RB</a-button>
+      </a-popconfirm>
+    </div>
+    <div :style="{ marginLeft: `${buttonWidth}px`, clear: 'both', whiteSpace: 'nowrap' }">
+      <a-popconfirm placement="bottomLeft" >
+        <template slot="title">
+          <span>prompt text</span>
+        </template>
+        <a-button>BL</a-button>
+      </a-popconfirm>
+      <a-popconfirm placement="bottom" >
+        <template slot="title">
+            <span>prompt text</span>
+        </template>
+        <a-button>Bottom</a-button>
+      </a-popconfirm>
+      <a-popconfirm placement="bottomRight" >
+        <template slot="title">
+          <span>prompt text</span>
+        </template>
+        <a-button>BR</a-button>
+      </a-popconfirm>
+    </div>
+  </div>
+</template>
+<script>
+import { message } from 'antd'
+
+export default {
+  data () {
+    return {
+      buttonWidth: 70,
+    }
+  },
+}
+</script>
+<style scoped>
+#components-a-tooltip-demo-placement .ant-btn {
+  width: 70px;
+  text-align: center;
+  padding: 0;
+  margin-right: 8px;
+  margin-bottom: 8px;
+}
+</style>
+```
+
diff --git a/components/tooltip/demo/placement.vue b/components/tooltip/demo/placement.vue
deleted file mode 100644
index 8454fa8d6..000000000
--- a/components/tooltip/demo/placement.vue
+++ /dev/null
@@ -1,112 +0,0 @@
-<template>
-<div id="components-tooltip-demo-placement">
-<md>
-## 位置
-位置有 12 个方向。
-</md>
-  <div :style="{ marginLeft: `${buttonWidth}px`, whiteSpace: 'nowrap' }">
-    <Tooltip placement="topLeft">
-      <template slot="title">
-        <span>prompt text</span>
-      </template>
-      <a-button>TL</a-button>
-    </Tooltip>
-    <Tooltip placement="top">
-      <template slot="title">
-        <span>prompt text</span>
-      </template>
-      <a-button>Top</a-button>
-    </Tooltip>
-    <Tooltip placement="topRight">
-      <template slot="title">
-        <span>prompt text</span>
-      </template>
-      <a-button>TR</a-button>
-    </Tooltip>
-  </div>
-  <div :style="{ width: `${buttonWidth}px`, float: 'left' }">
-    <Tooltip placement="leftTop">
-      <template slot="title">
-        <span>prompt text</span>
-      </template>
-      <a-button>LT</a-button>
-    </Tooltip>
-    <Tooltip placement="left">
-      <template slot="title">
-        <span>prompt text</span>
-      </template>
-      <a-button>Left</a-button>
-    </Tooltip>
-    <Tooltip placement="leftBottom">
-      <template slot="title">
-        <span>prompt text</span>
-      </template>
-      <a-button>LB</a-button>
-    </Tooltip>
-  </div>
-  <div :style="{ width: `${buttonWidth}px`, marginLeft: `${buttonWidth * 4 + 24 }px`}">
-    <Tooltip placement="rightTop">
-      <template slot="title">
-        <span>prompt text</span>
-      </template>
-      <a-button>RT</a-button>
-    </Tooltip>
-    <Tooltip placement="right">
-      <template slot="title">
-        <span>prompt text</span>
-      </template>
-      <a-button>Right</a-button>
-    </Tooltip>
-    <Tooltip placement="rightBottom">
-      <template slot="title">
-        <span>prompt text</span>
-      </template>
-      <a-button>RB</a-button>
-    </Tooltip>
-  </div>
-  <div :style="{ marginLeft: `${buttonWidth}px`, clear: 'both', whiteSpace: 'nowrap' }">
-    <Tooltip placement="bottomLeft">
-      <template slot="title">
-        <span>prompt text</span>
-      </template>
-      <a-button>BL</a-button>
-    </Tooltip>
-    <Tooltip placement="bottom">
-      <template slot="title">
-        <span>prompt text</span>
-      </template>
-      <a-button>Bottom</a-button>
-    </Tooltip>
-    <Tooltip placement="bottomRight">
-      <template slot="title">
-        <span>prompt text</span>
-      </template>
-      <a-button>BR</a-button>
-    </Tooltip>
-  </div>
-</div>
-</template>
-
-<script>
-import { Tooltip, Button } from 'antd'
-export default {
-  data () {
-    return {
-      buttonWidth: 70,
-    }
-  },
-  components: {
-    Tooltip,
-
-  },
-}
-</script>
-<style>
-#components-tooltip-demo-placement .ant-btn {
-  width: 70px;
-  text-align: center;
-  padding: 0;
-  margin-right: 8px;
-  margin-bottom: 8px;
-}
-</style>
diff --git a/components/tooltip/index.en-US.md b/components/tooltip/index.en-US.md
new file mode 100644
index 000000000..ff425827e
--- /dev/null
+++ b/components/tooltip/index.en-US.md
@@ -0,0 +1,32 @@
+## API
+
+| Property | Description | Type | Default |
+| -------- | ----------- | ---- | ------- |
+| title | The text shown in the tooltip | string\|slot | - |
+
+### Common API
+
+The following APIs are shared by Tooltip, Popconfirm, Popover.
+
+| Property | Description | Type | Default |
+| -------- | ----------- | ---- | ------- |
+| arrowPointAtCenter | Whether the arrow is pointed at the center of target | boolean | `false` |
+| autoAdjustOverflow | Whether to adjust popup placement automatically when popup is off screen | boolean | `true` |
+| defaultVisible | Whether the floating tooltip card is visible by default | boolean | `false` |
+| getPopupContainer | The DOM container of the tip, the default behavior is to create a `div` element in `body`.  | Function(triggerNode) | () => document.body |
+| mouseEnterDelay | Delay in seconds, before tooltip is shown on mouse enter | number | 0 |
+| mouseLeaveDelay | Delay in seconds, before tooltip is hidden on mouse leave | number | 0.1 |
+| overlayClassName | Class name of the tooltip card | string | - |
+| overlayStyle | Style of the tooltip card | object | - |
+| placement | The position of the tooltip relative to the target, which can be one of `top` `left` `right` `bottom` `topLeft` `topRight` `bottomLeft` `bottomRight` `leftTop` `leftBottom` `rightTop` `rightBottom` | string | `top` |
+| trigger | Tooltip trigger mode | `hover` \| `focus` \| `click` | `hover` |
+| visible | Whether the floating tooltip card is visible or not | boolean | `false` |
+
+### events
+| Events Name | Description | Arguments |
+| --- | --- | --- |
+| visibleChange | Callback executed when visibility of the tooltip card is changed | (visible) => void | - |
+
+## Note
+
+Please ensure that the child node of `Tooltip` accepts `mouseenter`, `mouseleave`, `focus`, `click` events.
diff --git a/components/tooltip/index.zh-CN.md b/components/tooltip/index.zh-CN.md
index 9cecf0f03..5e76c73af 100644
--- a/components/tooltip/index.zh-CN.md
+++ b/components/tooltip/index.zh-CN.md
@@ -1,23 +1,8 @@
----
-category: Components
-subtitle: 文字提示
-type: Data Display
-title: Tooltip
----
-
-简单的文字提示气泡框。
-
-## 何时使用
-
-鼠标移入则显示提示，移出消失，气泡浮层不承载复杂文本和操作。
-
-可用来代替系统默认的 `title` 提示，提供一个`按钮/文字/操作`的文案解释。
-
 ## API
 
 | 参数 | 说明 | 类型 | 默认值 |
 | --- | --- | --- | --- |
-| title | 提示文字 | `string` `function` `slot` | 无 |
+| title | 提示文字 | string\|slot | 无 |
 
 ### 共同的 API
 
@@ -25,8 +10,9 @@ title: Tooltip
 
 | 参数 | 说明 | 类型 | 默认值 |
 | --- | --- | --- | --- |
-| arrowPointAtCenter | 箭头是否指向目标元素中 | boolean | `false` |
+| arrowPointAtCenter | 箭头是否指向目标元素中心 | boolean | `false` |
 | autoAdjustOverflow | 气泡被遮挡时自动调整位置 | boolean | `true` |
+| defaultVisible | 默认是否显隐 | boolean | false |
 | getPopupContainer | 浮层渲染父节点，默认渲染到 body 上 | Function(triggerNode) | () => document.body |
 | mouseEnterDelay | 鼠标移入后延时多少才显示 Tooltip，单位：秒 | number | 0 |
 | mouseLeaveDelay | 鼠标移出后延时多少才隐藏 Tooltip，单位：秒 | number | 0.1 |
@@ -34,12 +20,13 @@ title: Tooltip
 | overlayStyle | 卡片样式 | object | 无 |
 | placement | 气泡框位置，可选 `top` `left` `right` `bottom` `topLeft` `topRight` `bottomLeft` `bottomRight` `leftTop` `leftBottom` `rightTop` `rightBottom` | string | top |
 | trigger | 触发行为，可选 `hover/focus/click` | string | hover |
-| visible(v-model) | 用于手动控制浮层显隐 | boolean | false |
+| visible | 用于手动控制浮层显隐 | boolean | false |
+| onVisibleChange | 显示隐藏的回调 | (visible) => void | 无 |
 
 ### 事件
 | 事件名称 | 说明 | 回调参数 |
-| visibleChange | 显示隐藏变换时触发 | (visible) |
-
+| --- | --- | --- |
+| visibleChange | 显示隐藏的回调 | (visible) => void |
 ## 注意
 
 请确保 `Tooltip` 的子元素能接受 `mouseenter`、`mouseleave`、`focus`、`click` 事件。