DEV Community 👩‍💻👨‍💻

Discussion on: 5 ways of displaying i18n translations in Vue

anzelika profile image
Anzelika Author

Though I just realised it's not reactive (if you change locale, it won't refresh the messages. v-text does though, without having to refresh the page. Do you know if there is a way to achieve reactivity with v-t?

Thread Thread
haruanm profile image
Haruan Justino • Edited on

You will need to re-render the component.
This dirty workarround can be done in some ways listed here:

When I needed to, I used this:

  <my-component v-if="renderComponent" />
  export default {
    data() {
      return {
        renderComponent: true,
    methods: {
      forceRerender() {
        // Remove my-component from the DOM
        this.renderComponent = false;

        this.$nextTick(() => {
          // Add the component back in
          this.renderComponent = true;

and executed the forceRerender on watch for language change.