vue.js:597 [Vue 警告]:属性或方法“$t"；没有定义 [英] vue.js:597 [Vue warn]: Property or method "$t" is not defined

问题描述

我正在尝试实施 vue-i18n Vue-i18n Github 我已经得到错误:

<块引用>

vue.js:597 [Vue 警告]:未定义属性或方法$t"

我的 vuejs 2 应用程序运行良好，直到我添加了入门代码，我哪里错了?提前致谢

<p>{{ $t("message.hello")}}</p>
<script src="https://unpkg.com/vue"></script><script src="https://unpkg.com/vue-i18n/dist/vue-i18n.js"></script><脚本>const app = new Vue({el: '#app',数据: {产品: ['靴子'，]},})<脚本>//准备好翻译的语言环境信息常量消息 = {zh: {信息: {你好:'你好世界'}},贾:{信息: {你好:'こんにちは、世界'}}}//使用选项创建 VueI18n 实例const i18n = 新的 VueI18n({locale: 'ja',//设置语言环境消息，//设置区域设置消息})//创建一个带有 `i18n` 选项的 Vue 实例new Vue({ i18n }).$mount('#app')//现在应用程序已经启动了！

解决方案

你必须在任何你想让 vue-i18n 工作的 Vue 实例中指定 i18n.

您的第一个实例没有指定 i18n.

此外，您有两个 Vue 实例，它们不能一起工作，所以您可能只需要一个(指定 i18n).

<p>{{ $t("message.hello")}}</p>
<script src="https://unpkg.com/vue"></script><script src="https://unpkg.com/vue-i18n/dist/vue-i18n.js"></script><脚本>//准备好翻译的语言环境信息常量消息 = {zh: {信息: {你好:'你好世界'}},贾:{信息: {你好:'こんにちは、世界'}}}//使用选项创建 VueI18n 实例const i18n = 新的 VueI18n({locale: 'ja',//设置语言环境消息，//设置区域设置消息})//创建一个带有 `i18n` 选项的 Vue 实例const app = new Vue({el: '#app',i18n,//这等价于 `i18n: i18n,`(自然没有引号)数据: {产品: ['靴子'，]},})//现在应用程序已经启动了！</script>

I am trying to implement vue-i18n Vue-i18n Github and I 'have got an error :

vue.js:597 [Vue warn]: Property or method "$t" is not defined

My vuejs 2 app is working fine until I add the getting starded code, where am I wrong? Thanks in advance

<div id="app">
  <p>{{ $t("message.hello")}}</p>
</div>

<script src="https://unpkg.com/vue"></script>
<script src="https://unpkg.com/vue-i18n/dist/vue-i18n.js"></script>

<script>
  const app = new Vue({
    el: '#app',
    data: {
      products: [
   'Boots',
  ]
   },
  })
</script>
<script>
 // Ready translated locale messages
 const messages = {
  en: {
    message: {
      hello: 'hello world'
    }
  },
  ja: {
    message: {
      hello: 'こんにちは、世界'
    }
  }
  }

 // Create VueI18n instance with options
  const i18n = new VueI18n({
    locale: 'ja', // set locale
    messages, // set locale messages
  })

  // Create a Vue instance with `i18n` option
  new Vue({ i18n }).$mount('#app')
// Now the app has started!
</script>

解决方案

You have to specify i18n in any Vue instance you want vue-i18n to work.

The first instance you have has no i18n specified.

Besides, you have two Vue instances, they don't work together, so what you probably need is just one (with i18n specified).

<div id="app">
  <p>{{ $t("message.hello")}}</p>
</div>
<script src="https://unpkg.com/vue"></script>
<script src="https://unpkg.com/vue-i18n/dist/vue-i18n.js"></script>
<script>
  // Ready translated locale messages
  const messages = {
    en: {
      message: {
        hello: 'hello world'
      }
    },
    ja: {
      message: {
        hello: 'こんにちは、世界'
      }
    }
  }
  // Create VueI18n instance with options
  const i18n = new VueI18n({
    locale: 'ja', // set locale
    messages, // set locale messages
  })
  // Create a Vue instance with `i18n` option
  const app = new Vue({
    el: '#app',
    i18n, // this is equivalent to `i18n: i18n,` (without quotes, naturally)
    data: {
      products: [
        'Boots',
      ]
    },
  })
  // Now the app has started!
</script>

这篇关于vue.js:597 [Vue 警告]:属性或方法“$t"；没有定义的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！