|
|
| Ligne 3 : |
Ligne 3 : |
| Payer 30€ {{Clickable button 3|Payer 30€|class=mw-ui-progressive}} | | Payer 30€ {{Clickable button 3|Payer 30€|class=mw-ui-progressive}} |
|
| |
|
| <syntaxhighlight> | | <button id="myButton">Cliquez ici</button> |
| <template>
| | <div id="message"></div> |
| <cdx-button :disabled="showMessage" @click="showMessage = true">
| |
| Show message
| |
| </cdx-button>
| |
| <cdx-message
| |
| v-if="showMessage"
| |
| type="success"
| |
| :fade-in="true"
| |
| :auto-dismiss="true"
| |
| :display-time="3000"
| |
| >
| |
| Success! This message will disappear...
| |
| </cdx-message>
| |
| </template>
| |
| | |
| <script>
| |
| const { defineComponent } = require("vue");
| |
| const { CdxMessage, CdxButton } = require("@wikimedia/codex");
| |
| | |
| module.exports = defineComponent({
| |
| name: "MessageAutoDismiss",
| |
| components: { CdxMessage, CdxButton },
| |
| data() {
| |
| return {
| |
| showMessage: false,
| |
| };
| |
| },
| |
| });
| |
| </script>
| |
| </syntaxhighlight> | |
Version du 20 octobre 2024 à 17:11
Troll life is good !
Payer 30€ Payer 30€
<button id="myButton">Cliquez ici</button>
