Перевести весь компонент через i18n в vuejs

Я хочу перевести весь свой компонент с помощью i18n и не знаю, как использовать $ t () в этом случае. У меня есть такие данные

[
{"prizeCount":"300","prizeSum":"2442000","gameStartAt":"2018-01-08 13:00:00.000000"},       
  {"prizeCount":"288","prizeSum":"2530000","gameStartAt":"2018-01-09 12:00:00.000000"}
]

Я передаю эти данные в :items="mydata" для таблицы, и я хочу перевести заголовок своих полей, например, я хочу перевести priCount на другой язык. Я использую vue-bootstrap. Какое для этого лучшее решение?

main.js:

import Vue from 'vue'
import App from './App'
import router from './router'
import BootstrapVue from 'bootstrap-vue'
import 'bootstrap/dist/css/bootstrap.css'
import 'bootstrap-vue/dist/bootstrap-vue.css'
import i18n from './i18n'

Vue.config.productionTip = false
Vue.use(BootstrapVue)
/* eslint-disable no-new */
new Vue({
  el: '#app',
  router,

  components: {
    App
  },

  i18n,
  template: '<App/>'
})

vue.js vue-i18n bootstrap-vue
person sinak    schedule 25.06.2019    source источник
comment
Можете ли вы указать main.js или app.js, куда вы импортируете i18n? @sinak   -  person mare96    schedule 25.06.2019
comment
@ mare96 сообщение отредактировано   -  person sinak    schedule 25.06.2019

Ответы (1)


arrow_upward
1
arrow_downward

Вы можете добавить это так:

new Vue({
  el: '#app',
  router,

  components: {
    App
  },

  i18n,
  t: i18n.t,
  template: '<App/>'
})

Чем в вашем компоненте вы можете использовать $t или this.$t в своих методах.

Чтобы получить ключи от вашего объекта, вы можете сделать это так:

data: [
 {"prizeCount":"300","prizeSum":"2442000","gameStartAt":"2018-01-08 13:00:00"},       
 {"prizeCount":"288","prizeSum":"2530000","gameStartAt":"2018-01-09 12:00:00"}
]

data.forEach( obj => {
  let keys = Object.keys(obj)
  // ['prizeCount', 'prizeSum', 'gameStartAt']
  newData = []
  newObj = {}
  keys.forEach( key => {
    let val = obj[key]
    let trans = this.$t(key)
    newObj[trans] = val
  })

  newData.push(newObj)
})
person mare96    schedule 25.06.2019
comment
не могу использовать $ (t) в этом случае. как я могу использовать это ?? что такое код - person sinak; 25.06.2019
comment
Вы можете использовать его как $t('hello'), hello - это переменная в вашем файле перевода. Вам непонятно, что вам нужно? Вам необходимо перевести ключи данных перед их отображением. - person mare96; 25.06.2019
comment
В вашем случае вы можете сделать это только в том случае, если вы передаете данные, как это, чтобы получить ключи от объекта и перевести ключи перед отправкой их в таблицу. - person mare96; 25.06.2019
comment
Отметьте редактировать. Может, у тебя получится сделать что-то подобное. Я не тестировал, но это хорошая идея. Удачи. - person mare96; 25.06.2019