---
order: 2
zh-CN:
	title: 自定义关闭按钮
	warningContent: 提示文案，警告提示。
	strongHintContent: 提示文案，强帮助提示。
	weakHint: 提示文案，弱帮助提示。
	link1: 文字链接1
	link2: 文字链接2
	button: 按钮
	closeText: 我知道了
en-US:
	title: Custom close button
	warningContent: Prompt copy, warning prompt.
	strongHintContent: Prompt copy, strong help prompt.
	weakHint: Prompt copy, weak help prompt.
	link1: Link1
	link2: Link2
	button: Button
	closeText: I Know
---

```jsx
import { Prompt, Button } from 'zent';

ReactDOM.render(
	<div className="zent-prompt-example">
		<Prompt
			type="warning"
			extraContent={<Button type="primary">{i18n.button}</Button>}
			closeContent={<a>{i18n.closeText}</a>}
		>
			<span>{i18n.warningContent}</span>
			<a href="javascript:;" className="zent-prompt-demo-text">
				{i18n.link1}
			</a>
			<a href="javascript:;" className="zent-prompt-demo-text">
				{i18n.link2}
			</a>
		</Prompt>
		<Prompt
			type="strongHint"
			extraContent={<Button type="primary">{i18n.button}</Button>}
			closeContent={<a>{i18n.closeText}</a>}
		>
			<span>{i18n.strongHintContent}</span>
			<a href="javascript:;" className="zent-prompt-demo-text">
				{i18n.link1}
			</a>
			<a href="javascript:;" className="zent-prompt-demo-text">
				{i18n.link2}
			</a>
		</Prompt>
		<Prompt
			type="weakHint"
			extraContent={<Button type="primary">{i18n.button}</Button>}
			closeContent={<a>{i18n.closeText}</a>}
		>
			<span>{i18n.weakHint}</span>
			<a href="javascript:;" className="zent-prompt-demo-text">
				{i18n.link1}
			</a>
			<a href="javascript:;" className="zent-prompt-demo-text">
				{i18n.link2}
			</a>
		</Prompt>
	</div>,
	mountNode
);
```