Skip to content
This repository was archived by the owner on Dec 31, 2024. It is now read-only.

Commit 9135a59

Browse files
kazuponkazupon
committed
⚡ improvement: change to method from computed property
Closes #141
1 parent 1cfbc5d commit 9135a59

4 files changed

Lines changed: 48 additions & 44 deletions

File tree

‎src/extend.js‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
/* @flow */
2+
3+
export default function extend (Vue: any): void {
4+
Vue.prototype.$t = function (key: Path, ...values: any): TranslateResult {
5+
const i18n = this.$i18n
6+
return i18n._t(key, i18n.locale, i18n.messages, this, ...values)
7+
}
8+
9+
Vue.prototype.$tc = function (key: Path, choice?: number, ...values: any): TranslateResult {
10+
const i18n = this.$i18n
11+
return i18n._tc(key, i18n.locale, i18n.messages, this, choice, ...values)
12+
}
13+
14+
Vue.prototype.$te = function (key: Path, locale?: Locale): boolean {
15+
const i18n = this.$i18n
16+
return i18n._te(key, i18n.locale, i18n.messages, [locale])
17+
}
18+
}

‎src/index.js‎

Lines changed: 18 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,7 @@ export default class VueI18n {
1919
_missing: ?MissingHandler
2020
_exist: Function
2121
_watcher: any
22+
_i18nWatcher: Function
2223
_silentTranslationWarn: boolean
2324

2425
constructor (options: I18nOptions = {}) {
@@ -54,11 +55,27 @@ export default class VueI18n {
5455
Vue.config.silent = silent
5556
}
5657

57-
watchLocale (): any {
58+
watchI18nData (fn: Function): Function {
59+
this._i18nWatcher = this._vm.$watch('$data', () => {
60+
fn && fn()
61+
}, { deep: true })
62+
return this._i18nWatcher
63+
}
64+
65+
unwatchI18nData (): boolean {
66+
if (this._i18nWatcher) {
67+
this._i18nWatcher()
68+
delete this._i18nWatcher
69+
}
70+
return true
71+
}
72+
73+
watchLocale (fn: Function): ?Function {
5874
if (!this._sync || !this._root) { return null }
5975
const target: any = this._vm
6076
this._watcher = this._root.vm.$watch('locale', (val) => {
6177
target.$set(target, 'locale', val)
78+
fn && fn()
6279
}, { immediate: true })
6380
return this._watcher
6481
}

‎src/install.js‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import { warn } from './util'
2+
import extend from './extend'
23
import mixin from './mixin'
34

45
export let Vue
@@ -22,6 +23,7 @@ export function install (_Vue) {
2223
get () { return this._i18n }
2324
})
2425

26+
extend(Vue)
2527
Vue.mixin(mixin)
2628

2729
// use object-based merge strategy

‎src/mixin.js‎

Lines changed: 10 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -3,44 +3,6 @@
33
import VueI18n from './index'
44
import { isPlainObject, warn } from './util'
55

6-
const $t = (vm: any): Function => {
7-
// add dependency tracking !!
8-
const locale: Locale = vm.$i18n.locale
9-
/* eslint-disable no-unused-vars */
10-
const fallback: Locale = vm.$i18n.fallbackLocal
11-
/* eslint-enable no-unused-vars */
12-
const messages: LocaleMessages = vm.$i18n.vm.messages
13-
return (key: string, ...values: any): TranslateResult => {
14-
return vm.$i18n._t(key, locale, messages, vm, ...values)
15-
}
16-
}
17-
const $tc = (vm: any): Function => {
18-
// add dependency tracking !!
19-
const locale: Locale = vm.$i18n.locale
20-
/* eslint-disable no-unused-vars */
21-
const fallback: Locale = vm.$i18n.fallbackLocal
22-
/* eslint-enable no-unused-vars */
23-
const messages: LocaleMessages = vm.$i18n.vm.messages
24-
return (key: string, choice?: number, ...values: any): TranslateResult => {
25-
return vm.$i18n._tc(key, locale, messages, vm, choice, ...values)
26-
}
27-
}
28-
const $te = (vm: any): Function => {
29-
// add dependency tracking !!
30-
const _locale: Locale = vm.$i18n.locale
31-
const messages: LocaleMessages = vm.$i18n.vm.messages
32-
return (key: string, locale?: Locale): boolean => {
33-
return vm.$i18n._te(key, _locale, messages, [locale])
34-
}
35-
}
36-
37-
function defineComputed (vm: any, options: any): void {
38-
options.computed = options.computed || {}
39-
options.computed.$t = () => $t(vm)
40-
options.computed.$tc = () => $tc(vm)
41-
options.computed.$te = () => $te(vm)
42-
}
43-
446
export default {
457
beforeCreate (): void {
468
const options: any = this.$options
@@ -49,7 +11,7 @@ export default {
4911
if (options.i18n) {
5012
if (options.i18n instanceof VueI18n) {
5113
this._i18n = options.i18n
52-
defineComputed(this, options)
14+
this._i18nWatcher = this._i18n.watchI18nData(() => this.$forceUpdate())
5315
} else if (isPlainObject(options.i18n)) {
5416
// component local i18n
5517
if (this.$root && this.$root.$i18n && this.$root.$i18n instanceof VueI18n) {
@@ -69,10 +31,10 @@ export default {
6931
}
7032

7133
this._i18n = new VueI18n(options.i18n)
72-
defineComputed(this, options)
34+
this._i18nWatcher = this._i18n.watchI18nData(() => this.$forceUpdate())
7335

7436
if (options.i18n.sync === undefined || !!options.i18n.sync) {
75-
this._localeWatcher = this.$i18n.watchLocale()
37+
this._localeWatcher = this.$i18n.watchLocale(() => this.$forceUpdate())
7638
}
7739
} else {
7840
if (process.env.NODE_ENV !== 'production') {
@@ -82,15 +44,20 @@ export default {
8244
} else if (this.$root && this.$root.$i18n && this.$root.$i18n instanceof VueI18n) {
8345
// root i18n
8446
this._i18n = this.$root.$i18n
85-
defineComputed(this, options)
47+
this._i18nWatcher = this._i18n.watchI18nData(() => this.$forceUpdate())
8648
}
8749
},
8850

8951
beforeDestroy (): void {
9052
if (!this._i18n) { return }
9153

54+
if (this._i18nWatcher) {
55+
this._i18n.unwatchI18nData()
56+
delete this._i18nWatcher
57+
}
58+
9259
if (this._localeWatcher) {
93-
this.$i18n.unwatchLocale()
60+
this._i18n.unwatchLocale()
9461
delete this._localeWatcher
9562
}
9663

0 commit comments

Comments
 (0)