feat(Tooltip): add arrow props to hide arrow

close #207

src/components/Tooltip/Tooltip.jsx

@@ -20,21 +20,26 @@ class Tooltip extends Component {
         placement: PropTypes.oneOf(Placement),
         /** @ignore */
         popupClassName: PropTypes.string,
+        /** 是否显示箭头 */
+        arrow: PropTypes.bool,
         /** 主题风格 */
         theme: PropTypes.oneOfType([PropTypes.oneOf(Theme), PropTypes.object])
     };
     static defaultProps = {
         theme: 'light',
+        arrow: true,
         placement: Placement[0]
     };
     renderPopup(theme) {
-        const { popup, placement, theme: themeType } = this.props;
+        const { popup, placement, theme: themeType, arrow } = this.props;
         return (
             <ThemeProvider theme={theme}>
                 <TooltipWrap placement={placement} themeType={themeType}>
-                    <Arrow>
-                        <ArrowInner />
-                    </Arrow>
+                    {arrow && (
+                        <Arrow>
+                            <ArrowInner />
+                        </Arrow>
+                    )}
                     <ContentWrap themeType={themeType}>{popup}</ContentWrap>
                 </TooltipWrap>
             </ThemeProvider>

src/components/Tooltip/Tooltip.md

@@ -15,6 +15,11 @@
 ```js {"codepath": "theme.jsx"}
 ```
 
+*   arrow
+
+```js {"codepath": "arrow.jsx"}
+```
+
 *   placement
 
 ```js {"codepath": "placement.jsx"}

src/components/Tooltip/__demo__/arrow.jsx

@@ -0,0 +1,23 @@
+import React from 'react';
+
+import Tooltip from 'src/components/Tooltip';
+import Button from 'src/components/Button';
+
+// demo start
+const Demo = () => (
+    <div>
+        <div className="demo-wrap">
+            <Tooltip popup={<p>tooltip message</p>} visible>
+                <Button>Hover</Button>
+            </Tooltip>
+        </div>
+        <div className="demo-wrap">
+            <Tooltip popup={<p>tooltip message</p>} arrow={false} visible>
+                <Button>Hover</Button>
+            </Tooltip>
+        </div>
+    </div>
+);
+// demo end
+
+export default Demo;

src/components/Tooltip/__demo__/tooltip.jsx

@@ -1,9 +1,11 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import Tooltip from 'components/Tooltip';
-import Radio from 'components/Radio';
-import Form from 'components/Form';
-import Button from 'components/Button';
+
+import Tooltip from 'src/components/Tooltip';
+import Radio from 'src/components/Radio';
+import Form from 'src/components/Form';
+import Button from 'src/components/Button';
+import Switch from 'src/components/Switch';
 
 // demo start
 const { Placement, Theme } = Tooltip;
@@ -18,11 +20,12 @@ class Demo extends React.Component {
         super(props);
         this.state = {
             placement: Placement[0],
-            theme: Theme[0]
+            theme: Theme[0],
+            arrow: Tooltip.defaultProps.arrow
         };
     }
     render() {
-        const { placement, theme } = this.state;
+        const { placement, theme, arrow } = this.state;
         const itemLayout = {
             labelCol: {
                 span: 3
@@ -52,9 +55,18 @@ class Demo extends React.Component {
                             }))}
                         />
                     </Form.Item>
+                    <Form.Item label="arrow" {...itemLayout}>
+                        <Switch onChange={arrow => this.setState({ arrow })} checked={arrow} />
+                    </Form.Item>
                 </Form>
                 <div className="demo-wrap">
-                    <Tooltip placement={placement} popup={<Popup />} theme={theme}>
+                    <Tooltip
+                        placement={placement}
+                        popup={<Popup />}
+                        theme={theme}
+                        arrow={arrow}
+                        getPopupContainer={() => document.body}
+                    >
                         <Content>content</Content>
                     </Tooltip>
                 </div>