Example usage of translation keys from yaml files within vue component

This commit is contained in:
Julie Lenaerts 2024-09-17 16:48:44 +02:00
parent 5921404712
commit 611261c863
2 changed files with 13 additions and 2 deletions

View File

@ -17,7 +17,7 @@
<slot name="body"></slot>
</div>
<div class="modal-footer" v-if="!hideFooter">
<button class="btn btn-cancel" @click="$emit('close')">{{ $t('action.close') }}</button>
<button class="btn btn-cancel" @click="$emit('close')">{{ closeKey }}</button>
<slot name="footer"></slot>
</div>
</div>
@ -30,6 +30,7 @@
<script lang="ts">
import {defineComponent} from "vue";
import { trans, MODAL_ACTION_CLOSE } from '../../../../../../../../../../assets/translator'
/*
* This Modal component is a mix between Vue3 modal implementation
* [+] with 'v-if:showModal' directive:parameter, html scope is added/removed not just shown/hidden
@ -53,7 +54,13 @@ export default defineComponent({
default: false
}
},
emits: ['close']
emits: ['close'],
computed: {
closeKey() {
console.log('close key', trans(MODAL_ACTION_CLOSE))
return trans(MODAL_ACTION_CLOSE)
}
}
});
</script>

View File

@ -1,3 +1,7 @@
modal:
action:
close: Fermer
"This program is free software: you can redistribute it and/or modify it under the terms of the <strong>GNU Affero General Public License</strong>": "Ce programme est un logiciel libre: vous pouvez le redistribuer et/ou le modifier selon les termes de la licence <strong>GNU Affero GPL</strong>"
User manual: Manuel d'utilisation
Search: Rechercher