diff options
| author | Sergio Gimeno <sgimeno@wikimedia.org> | 2023-04-20 19:43:15 +0200 |
|---|---|---|
| committer | Sergio Gimeno <sgimeno@wikimedia.org> | 2023-04-21 12:51:52 +0000 |
| commit | 7cdb310d64d56ee75b31aa5367bb022cc32159b5 (patch) | |
| tree | 3c3a80ac212f1994326a78bdedc43d164a57526e /resources | |
| parent | b11c3dcc1374b459c40d793944feb0226ce6050c (diff) | |
| download | mediawikicore-7cdb310d64d56ee75b31aa5367bb022cc32159b5.tar.gz mediawikicore-7cdb310d64d56ee75b31aa5367bb022cc32159b5.zip | |
Vue: make i18n plugin injectable in Vue 3 setup functions
This allows to inject i18n function to components using the
setup() function from composition API.
Avoid warnings from the Vue 2 compatibility calls to Vue.use.
Bug: T335188
Change-Id: I28659ff45a60fa22b9bf7d8fa2fa598bb3926508
Diffstat (limited to 'resources')
| -rw-r--r-- | resources/src/vue/i18n.js | 17 |
1 files changed, 13 insertions, 4 deletions
diff --git a/resources/src/vue/i18n.js b/resources/src/vue/i18n.js index 7e2bb8be57e3..a914c8988dfa 100644 --- a/resources/src/vue/i18n.js +++ b/resources/src/vue/i18n.js @@ -23,13 +23,22 @@ module.exports = { * @param {...Mixed} parameters Values for $N replacements * @return {mw.Message} */ + function $i18n( key, ...parameters ) { + // eslint-disable-next-line mediawiki/msg-doc + return mw.message( key, ...parameters ); + } // This should be app.config.globalProperties.$i18n = ... , but that doesn't work // with Vue 2-style app construction. Change this to use globalProperties when we're // ready to drop compatibility for Vue 2-style new Vue( ... ) - app.prototype.$i18n = function ( key, ...parameters ) { - // eslint-disable-next-line mediawiki/msg-doc - return mw.message( key, ...parameters ); - }; + app.prototype.$i18n = $i18n; + // Calls to static method Vue.use cause Vue to argue about the wrong usage of .provide() + // before a Vue application instance is created. In those cases typeof app === 'function'; + // This check can be drop when Vue 2 compatibility is abandoned. + if ( typeof app === 'object' ) { + // Facilitate the usage of $i18n in Vue 3 applications using setup() function + // from the composition API. + app.provide( 'i18n', $i18n ); + } function renderI18nHtml( el, binding ) { /* eslint-disable mediawiki/msg-doc */ |