xiCO2k / laravel-vue-i18n

Allows to connect your `Laravel` Framework translation files with `Vue`.
MIT License
598 stars 49 forks source link

How to use $t inside of computed ? #42

Closed PetroGromovo closed 2 years ago

PetroGromovo commented 2 years ago

In Laravel 9 / vuejs 3 with Composition API app I use “this” when I need to get label in current locale withing js script of form request :

import {defineComponent, ref} from 'vue'
import {Inertia} from '@inertiajs/inertia'

export default defineComponent({
    props: {
        status: String
    },

    setup(props) {
        let formLogin = ref(useForm({
            email: '',
            password: '',
            remember: true
        }))

        function loginSubmit() {

            formLogin.value.post(route('login'), {
                preserveScroll: true,
                onSuccess: (data) => {

                    Toast.fire({
                        icon: 'success',
                        position: 'center',
                        title: this.$t('You are logged into the app as admin') // IT WORKS !
                    })

But I failed to make similar way when using $t inside of computed :

    setup(props, attrs) {
        ...
        let self= this
        let getSharedDocumentSubmitBtnTitle = computed(() => {
            console.log(this)     // I got "undefined" here
            console.log(self)     // I got "undefined" here
            console.log(self.$t)  // I got error here

            // I see it like that :
            return Condition ? capitalize(self.$t('common.create')) : capitalize(self.$t('common.update'))
        });

In which way can I get valid context and use $t inside of computed ?

Thanks in advance!

xiCO2k commented 2 years ago

you can use the wTrans method inside a computed.