提交 e62c4c76 编写于 作者: P popomore

feat: support more placement for popconfirm

上级 84647fa1
......@@ -7,7 +7,7 @@
---
````jsx
import { Popconfirm, message } from 'antd';
import { Popconfirm, message, Button } from 'antd';
const text = '确定要删除这个任务吗?';
......@@ -16,17 +16,44 @@ function confirm() {
}
ReactDOM.render(<div>
<Popconfirm placement="leftTop" title={text} onConfirm={confirm}>
<Button>左上</Button>
</Popconfirm>
<Popconfirm placement="left" title={text} onConfirm={confirm}>
<a href="javascript:;">左边</a>
<Button></Button>
</Popconfirm>
<Popconfirm placement="leftBottom" title={text} onConfirm={confirm}>
<Button>左下</Button>
</Popconfirm>
<br/>
<Popconfirm placement="topLeft" title={text} onConfirm={confirm}>
<Button>上左</Button>
</Popconfirm>
<Popconfirm placement="top" title={text} onConfirm={confirm}>
<a href="javascript:;">上边</a>
<Button></Button>
</Popconfirm>
<Popconfirm placement="topRight" title={text} onConfirm={confirm}>
<Button>上右</Button>
</Popconfirm>
<br/>
<Popconfirm placement="bottomLeft" title={text} onConfirm={confirm}>
<Button>下左</Button>
</Popconfirm>
<Popconfirm placement="bottom" title={text} onConfirm={confirm}>
<a href="javascript:;">下边</a>
<Button></Button>
</Popconfirm>
<Popconfirm placement="bottomRight" title={text} onConfirm={confirm}>
<Button>下右</Button>
</Popconfirm>
<br/>
<Popconfirm placement="rightTop" title={text} onConfirm={confirm}>
<Button>右上</Button>
</Popconfirm>
<Popconfirm placement="right" title={text} onConfirm={confirm}>
<a href="javascript:;">右边</a>
<Button></Button>
</Popconfirm>
<Popconfirm placement="rightBottom" title={text} onConfirm={confirm}>
<Button>右下</Button>
</Popconfirm>
</div>, document.getElementById('components-popconfirm-demo-placement'));
````
......@@ -35,4 +62,8 @@ ReactDOM.render(<div>
.code-box-demo .ant-popover-wrap > a {
margin-right: 1em;
}
.code-box-demo .ant-btn {
margin-right: 1em;
margin-bottom: 1em;
}
</style>
......@@ -17,43 +17,43 @@ const content = <div>
ReactDOM.render(<div>
<Popover placement="leftTop" title={text} overlay={content} trigger="click">
<button className="ant-btn">左上</button>
<Button>左上</Button>
</Popover>
<Popover placement="left" title={text} overlay={content} trigger="click">
<Button></Button>
</Popover>
<Popover placement="leftBottom" title={text} overlay={content} trigger="click">
<button className="ant-btn">左下</button>
<Button>左下</Button>
</Popover>
<br/>
<Popover placement="topLeft" title={text} overlay={content} trigger="click">
<button className="ant-btn">上左</button>
<Button>上左</Button>
</Popover>
<Popover placement="top" title={text} overlay={content} trigger="click">
<Button></Button>
</Popover>
<Popover placement="topRight" title={text} overlay={content} trigger="click">
<button className="ant-btn">上右</button>
<Button>上右</Button>
</Popover>
<br/>
<Popover placement="bottomLeft" title={text} overlay={content} trigger="click">
<button className="ant-btn">下左</button>
<Button>下左</Button>
</Popover>
<Popover placement="bottom" title={text} overlay={content} trigger="click">
<Button></Button>
</Popover>
<Popover placement="bottomRight" title={text} overlay={content} trigger="click">
<button className="ant-btn">下右</button>
<Button>下右</Button>
</Popover>
<br/>
<Popover placement="rightTop" title={text} overlay={content} trigger="click">
<button className="ant-btn">右上</button>
<Button>右上</Button>
</Popover>
<Popover placement="right" title={text} overlay={content} trigger="click">
<Button></Button>
</Popover>
<Popover placement="rightBottom" title={text} overlay={content} trigger="click">
<button className="ant-btn">右下</button>
<Button>右下</Button>
</Popover>
</div>, document.getElementById('components-popover-demo-placement'));
````
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册