test/ant-design
1
0
Fork 0
mirror of https://gitee.com/ant-design/ant-design.git synced 2024-11-30 02:59:04 +08:00
Code Issues Actions 68 Packages Projects Releases Wiki Activity

docs: Translation popconfirm (#3205)

Browse Source 
* doc translation

* translation enhancement

* translate demos
This commit is contained in:
Shawn Sit 2016-09-29 11:27:59 +08:00 committed by Benjy Cui
parent 8b7d013116
commit d2b7c4f2ec
3 changed files with 41 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
components/popconfirm/demo/basic.md
View File

@ -17,16 +17,16 @@ The basic example.
import { Popconfirm, message } from 'antd';
function confirm() {
message.success('点击了确定');
message.success('Click on Yes');
}
function cancel() {
message.error('点击了取消');
message.error('Click on No');
}
ReactDOM.render(
<Popconfirm title="确定要删除这个任务吗？" onConfirm={confirm} onCancel={cancel}>
<a href="#">删除</a>
<Popconfirm title="Are you sure delete this task?" onConfirm={confirm} onCancel={cancel} okText="Yes" cancelText="No">
<a href="#">Delete</a>
</Popconfirm>
, mountNode);
````

20
components/popconfirm/demo/dynamic-trigger.md
View File

@ -20,7 +20,7 @@ const App = React.createClass({
getInitialState() {
return {
visible: false,
condition: true, // 是否满足条件，不满足则弹出确认框
condition: true, // Whether meet the condition, if not show popconfirm.
};
},
changeCondition(value) {
@ -28,37 +28,39 @@ const App = React.createClass({
},
confirm() {
this.setState({ visible: false });
message.success('进行下一步操作. next step.');
message.success('Next step.');
},
cancel() {
this.setState({ visible: false });
message.error('点击了取消');
message.error('Click on cancel.');
},
handleVisibleChange(visible) {
if (!visible) {
this.setState({ visible });
return;
}
// 打开前进行判断
// Determining condition before show the popconfirm.
console.log(this.state.condition);
if (this.state.condition) {
this.confirm(); // 直接执行下一步
this.confirm(); // next step
} else {
this.setState({ visible }); // 进行确认
this.setState({ visible }); // show the popconfirm
}
},
render() {
return (
<div>
<Popconfirm title="确定要删除这个任务吗？"
<Popconfirm title="Are you sure delete this task?"
visible={this.state.visible} onVisibleChange={this.handleVisibleChange}
onConfirm={this.confirm} onCancel={this.cancel}
okText="Yes"
cancelText="No"
>
<a href="#">删除某任务</a>
<a href="#">Delete a task</a>
</Popconfirm>
<br />
<br />
点击是否直接执行：<Switch defaultChecked onChange={this.changeCondition} />
Whether directly execute：<Switch defaultChecked onChange={this.changeCondition} />
</div>
);
},

52
components/popconfirm/demo/placement.md
View File

@ -16,55 +16,55 @@ There are 12 `placement` options available. Use `arrowPointAtCenter` if you want
````jsx
import { Popconfirm, message, Button } from 'antd';
const text = '确定要删除这个任务吗？';
const text = 'Are you sure delete this task?';
function confirm() {
message.info('点击了确定');
message.info('Click on Yes.');
}
ReactDOM.render(<div>
<div style={{ marginLeft: 60 }}>
<Popconfirm placement="topLeft" title={text} onConfirm={confirm}>
<Button>上左</Button>
<Popconfirm placement="topLeft" title={text} onConfirm={confirm} okText="Yes" cancelText="No">
<Button>TL</Button>
</Popconfirm>
<Popconfirm placement="top" title={text} onConfirm={confirm}>
<Button>上边</Button>
<Popconfirm placement="top" title={text} onConfirm={confirm} okText="Yes" cancelText="No">
<Button>Top</Button>
</Popconfirm>
<Popconfirm placement="topRight" title={text} onConfirm={confirm}>
<Button>上右</Button>
<Popconfirm placement="topRight" title={text} onConfirm={confirm} okText="Yes" cancelText="No">
<Button>TR</Button>
</Popconfirm>
</div>
<div style={{ width: 60, float: 'left' }}>
<Popconfirm placement="leftTop" title={text} onConfirm={confirm}>
<Button>左上</Button>
<Popconfirm placement="leftTop" title={text} onConfirm={confirm} okText="Yes" cancelText="No">
<Button>LT</Button>
</Popconfirm>
<Popconfirm placement="left" title={text} onConfirm={confirm}>
<Button>左边</Button>
<Popconfirm placement="left" title={text} onConfirm={confirm} okText="Yes" cancelText="No">
<Button>Left</Button>
</Popconfirm>
<Popconfirm placement="leftBottom" title={text} onConfirm={confirm}>
<Button>左下</Button>
<Popconfirm placement="leftBottom" title={text} onConfirm={confirm} okText="Yes" cancelText="No">
<Button>LB</Button>
</Popconfirm>
</div>
<div style={{ width: 60, marginLeft: 252 }}>
<Popconfirm placement="rightTop" title={text} onConfirm={confirm}>
<Button>右上</Button>
<Popconfirm placement="rightTop" title={text} onConfirm={confirm} okText="Yes" cancelText="No">
<Button>RT</Button>
</Popconfirm>
<Popconfirm placement="right" title={text} onConfirm={confirm}>
<Button>右边</Button>
<Popconfirm placement="right" title={text} onConfirm={confirm} okText="Yes" cancelText="No">
<Button>Right</Button>
</Popconfirm>
<Popconfirm placement="rightBottom" title={text} onConfirm={confirm}>
<Button>右下</Button>
<Popconfirm placement="rightBottom" title={text} onConfirm={confirm} okText="Yes" cancelText="No">
<Button>RB</Button>
</Popconfirm>
</div>
<div style={{ marginLeft: 60, clear: 'both' }}>
<Popconfirm placement="bottomLeft" title={text} onConfirm={confirm}>
<Button>下左</Button>
<Popconfirm placement="bottomLeft" title={text} onConfirm={confirm} okText="Yes" cancelText="No">
<Button>BL</Button>
</Popconfirm>
<Popconfirm placement="bottom" title={text} onConfirm={confirm}>
<Button>下边</Button>
<Popconfirm placement="bottom" title={text} onConfirm={confirm} okText="Yes" cancelText="No">
<Button>Bottom</Button>
</Popconfirm>
<Popconfirm placement="bottomRight" title={text} onConfirm={confirm}>
<Button>下右</Button>
<Popconfirm placement="bottomRight" title={text} onConfirm={confirm} okText="Yes" cancelText="No">
<Button>BR</Button>
</Popconfirm>
</div>
</div>, mountNode);