Modular dialog box, displayed in the floating layer, guides users to perform related operations, often used in message prompts, message confirmation, or complete specific interaction operations on the current page。
弹出框组件支持函数调用和组件调用两种方式。
The pop -up box components support the function call and component call.
### 安装
### Install
```js
import{Dialog}from'@nutui/nutui-react'
```
## 代码演示
## Code demonstration
### 函数式调用
### Functional call
:::demo
```tsx
<Celltitle="基础弹框"onClick={()=>{
Dialog.alert({
title:'基础弹框',
content:'支持函数调用和组件调用两种方式。'
});
}}></Cell>
<Celltitle="无标题弹框"onClick={()=>{
importReactfrom"react";
import{Cell,Dialog}from'@nutui/nutui-react';
constApp=()=>{
return(
<>
<Celltitle="Basic bullet"onClick={()=>{
Dialog.alert({
title:'Basic bullet',
content:'Support function calls and module call.'
});
}}>
</Cell>
<Celltitle="Non -title bullet box"onClick={()=>{
Dialog.alert({
content:'Non -title bullet box'
});
}}>
</Cell>
<Celltitle="Prompt bomb frame"onClick={()=>{
Dialog.alert({
content:'无标题弹框'
});
}}></Cell>
<Celltitle="提示弹框"onClick={()=>{
Dialog.alert({
title:'温馨提示',
content:'支持函数调用和组件调用两种方式。',
noCancelBtn:true
});
}}></Cell>
<Celltitle="底部按钮 垂直调用"onClick={()=>{
Dialog.alert({
title:'温馨提示',
content:'支持函数调用和组件调用两种方式。',
footerDirection:'vertical'
});
}}></Cell>
title:'Kind tips',
content:'Support function calls and module call.',
noCancelBtn:true
});
}}>
</Cell>
<Celltitle="The bottom button is called vertically"onClick={()=>{
Dialog.alert({
title:'Kind tips',
content:'Support function calls and module call.',
