Gebruikers die de knop Block Copy hebben gebruikt, zijn geen onbekende in de Snackbar, die de gebruiker informeert over de resultaten van de uitvoering van de applicatie. Dit artikel geeft een voorbeeld van hoe u Snackbar kunt gebruiken om te voldoen aan de behoefte van de gebruiker aan aangepaste interactie.
API
| Functie | Beschrijving |
|---|---|
show(body: String, duration: number = 2000) | body: de hoofdtekst van het bericht, duration: de duur van het bericht, in milliseconden. |
Exporteren
Dankzij assets/main/js/custom.ts kunnen we het JavaScript aanpassen, hier exporteren we de hele Snackbar als globale variabele:
1import Snackbar from 'js/snackbar';
2
3// Show a message via JavaScript.
4Snackbar.show('a message with 3s duration from pure JavaScript', 3000)
5
6// Export the Snackbar as a global variable, so that you can send a message from a HTML.
7// Such as: <button onclick="Snackbar.show('message from a button')">Snackbar</button>.
8const _global = (window || global ) as any
9_global.Snackbar = Snackbar
Gebruik
Dan kunnen we het oproepen in HTML of JavaScript:
1<button onclick="Snackbar.show('message from a button')">Snackbar</button>
Zie Haken voor hoe u aangepaste HTML kunt injecteren.
