hideToasts()
import toast from "devextreme-vue/hide-toasts"
The code below uses a Button to hide all the Toast components on click.
jQuery
index.html
index.js
<div id="hide"></div>
$("#hide").dxButton({ text: "Hide all Toasts", onClick() { DevExpress.ui.hideToasts(); } });
Angular
app.component.html
app.component.ts
<dx-button text="Hide all Toasts" (onClick)="onClick($event)" > </dx-button>
import { Component } from '@angular/core'; import hideToasts from 'devextreme/ui/toast/hide_toasts'; @Component({ selector: 'app-root', templateUrl: './app.component.html', styleUrls: ['./app.component.css'] }) export class AppComponent { onClick() { hideToasts(); } }
Vue
App.vue
<template> <DxButton text="Hide all Toasts" @click="onClick" /> </template> <script> import { DxButton } from 'devextreme-vue/button'; import hideToasts from 'devextreme/ui/toast/hide_toasts'; export default { methods: { onClick() { hideToasts(); } } } </script>
React
App.js
import React from 'react'; import { Button } from 'devextreme-react/button'; import hideToasts from 'devextreme/ui/toast/hide_toasts'; function App() { const onClick = () => { hideToasts(); } return ( <Button text="Hide all Toasts" onClick={onClick} /> ); } export default App;
Feel free to share topic-related thoughts here.
If you have technical questions, please create a support ticket in the DevExpress Support Center.
Thank you for the feedback!
If you have technical questions, please create a support ticket in the DevExpress Support Center.