Methods And Props

Available 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 - child reference, [read here]

Available Methods

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

Object Parameter Simplert

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

Copyright © 2017 by Irfan Maulana

results matching ""

    No results matching ""