[Vuejs]-Vue global properties with composables / onScopeDispose() is called when there is no active effect scope to be associated with

by

1👍

✅

Vue3 SFC Playground

Composable are meant for using in components. You are trying to use it outside a component. So component hooks cannot be executed like onScopeDispose() in your case.

So you could define your $t in the root app component, but better use some vue query’s api to load your translations without a composable:

<script setup>
import { ref, getCurrentInstance } from 'vue'

const self = getCurrentInstance();

self.root.appContext.app.config.globalProperties.$t = str => `<span style="background:red">${str}</span>`;

const msg = ref('Hello World!')

</script>

<template>
  <h1 v-html="$t(msg)"></h1>
  <input v-model="msg">
</template>
👤Alexander Nenashev

Leave a comment