Taro.showModal(option)
Displays the modal dialog box.
Note
- For Android 6.7.2 and below, when you tap Cancel or Mask, the callback will fail with the errMsg of "fail cancel".
- For Android 6.7.2 & above and iOS, tapping Mask will not close the modal dialog box, so avoid using the "Cancel" branch to implement the business logic.
Type
(option: Option) => Promise<SuccessCallbackResult>
Parameters
Option
Property | Type | Required | Description |
---|---|---|---|
title | string | No | Prompt title |
content | string | No | Prompt content |
cancelColor | string | No | The text color of the "Cancel" button, which must be a color string in hexadecimal format |
cancelText | string | No | The text of the "Cancel" button, not more than 4 characters |
confirmColor | string | No | The text color of the "OK" button, which must be a color string in hexadecimal format |
confirmText | string | No | The text of the "OK "button, not more than 4 characters |
showCancel | boolean | No | Indicates whether to display the "Cancel" button |
success | (result: SuccessCallbackResult) => void | No | The callback function for a successful API call |
fail | (res: CallbackResult) => void | No | The callback function for a failed API call |
complete | (res: CallbackResult) => void | No | The callback function used when the API call completed (always executed whether the call succeeds or fails) |
SuccessCallbackResult
Property | Type | Description |
---|---|---|
cancel | boolean | When the value is "true", it indicates that the user tapped the "Cancel" button. (this is used for Android system to distinguish whether "Mask" or "Cancel" is tapped) |
confirm | boolean | When the value is "true", it indicates that the user tapped the "OK" button. |
errMsg | string | call result |
Sample Code
Taro.showModal({
title: 'Prompt',
content: 'This is a modal pop-up window',
success (res) {
if (res.confirm) {
console.log('"OK" is tapped')
} else if (res.cancel) {
console.log('"Cancel" is tapped')
}
}
})
API Support
API | WeChat Mini-Program | H5 | React Native |
---|---|---|---|
Taro.showModal | ✔️ | ✔️ | ✔️ |