用vuex翻译v-html指令i18 vue中的管道

import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)

const store = new Vuex.Store({
  state: {
    language: 'en', // 默认语言为英文
    translations: {
      en: {
        // 英文翻译
        // ...
      },
      zh: {
        // 中文翻译
        // ...
      },
      // 其他语言翻译
      // ...
    }
  },
  mutations: {
    setLanguage(state, language) {
      state.language = language
    }
  },
  getters: {
    translation(state) {
      return state.translations[state.language]
    }
  }
})

new Vue({
  store,
  // ...
}).$mount('#app')

<template>
  <div>
    <div v-html="translatedContent"></div>
  </div>
</template>

<script>
import { mapGetters } from 'vuex'

export default {
  computed: {
    ...mapGetters(['translation']),
    translatedContent() {
      // 假设要翻译的内容存储在data中的content变量中
      const content = this.content
      const translation = this.translation

      // 使用翻译内容替换原始内容
      return content.replace(/{{(.*?)}}/g, (match, key) => {
        return translation[key] || match
      })
    }
  }
}
</script>