Comment on page
Methods And Props
You can add props in
simplert component, example :<simplert :useRadius="true"
:useIcon="true"
ref="simplert">
</simplert>
Attribute | Value Type | Default Value | Description |
:useRadius | Boolean | true | Setting useRadius to true will make Simplert's message box and buttons have rounded corners |
:useIcon | Boolean | true | true : will use SweatAlert icon based on type, false : not use icon |
ref | String | - |
You can call available methods in
simplert with this.$refs.simplert.someMethod(), example :var obj = {
isShown: true,
title: 'test',
message: 'message',
type: 'success',
onClose: this.onClose
}
this.$refs.simplert.openSimplert(obj)
Method Name | Parameter | Description |
closeOverlay | - | close overlay and simplert (internal method : do not call) |
justCloseSimplert | - | close simplert without fired onClose method |
whenConfirm | - | fired onConfirm and close simplert popup |
closeSimplert | - | close simplert popup |
openSimplert | Object | open simplert popup with predifined object passed |
Property | Type - Default | Description |
title | string - empty | Title of alert |
message | string - empty | Message of alert |
type | string - 'info' | Type of icon will used |
customClass | string - empty | Adding extra class in parent simplert |
customIconUrl | string - empty | Using custom icon instead of default |
customCloseBtnText | string - empty | Using custom text in button close |
customCloseBtnClass | string - empty | Change default class in button close |
onClose | func - undefined | Function will fired when close button clicked |
useConfirmBtn | boolean - false | Using two button with close and confirm |
customConfirmBtnText | string - empty | Using custom text in button confirm |
customConfirmBtnClass | string - empty | Change default class in button confirm |
onConfirm | func - undefined | Function will fired when confirm button clicked |
disableOverlayClick | string - empty | Prevent click overlay will close alert |
hideAllButton | boolean - false | Hide both button close and confirm |
onOpen | func - undefined | Function will fired when open alert |
showXclose | boolean - false | Show X close button in right corner of alert |
{
title: 'test', //string -- title alert
message: 'message', //string -- message alert
type: 'success', //string -- type : info (default), success, warning, error
customClass: '', //string -- custom class in simplert div
customIconUrl: '', //string -- custom url custom image icon
customCloseBtnText: '', //string -- close button text
customCloseBtnClass: '', //string -- custom class for close button
onClose: this.onClose, //function -- when close triggered
useConfirmBtn: false, //boolean -- using confirm button
customConfirmBtnText: '', //string -- confirm button text
customConfirmBtnClass: '', //string -- custom class for confirm button
onConfirm: this.onConfirm, //function -- when confirm button triggered
disableOverlayClick: false, //boolean -- set to true if you want disable overlay click function
hideAllButton: false, //boolean -- set to true if you want hide all button
onOpen: null, //function -- when simplert open will fire this method if available
showXclose: true //boolean -- show x close button
}
vue2-simplert
Last modified 5yr ago