Internationalization

Corvina SDK supports internationalization using the library i18n.

Import useCorvinaI18n

Importing the function useCorvinaI18n from corvina you can instance the i18n object and use it in your widget.

import { useCorvinaI18n } from "corvina";
const i18n = useCorvinaI18n({"en-US": {"message": "EN-Message"}, "it-IT": {"message": "IT-Messaggio"}});

A generic example of use:

i18n.locale = "en-US"; // only for example and test in sdk environment
let message = i18n.t("message");
console.log(message);
// Logs: EN-Message
i18n.locale = "it-IT"; // only for example and test in sdk environment
let message = i18n.t("message");
console.log(message);
// Logs: IT-Messaggio

note

When the widget will be deployed to the cloud the locale will be set automatically to the user locale.

Use i18n in widget

To use it inside the widget, you need to expose the i18n in the data object:

<template>
  <div :style="widgetStyle">
    <div class="center">
      {{i18n.t("message")}}
    </div>
  </div>
</template>

<script>
import { useCorvinaI18n } from "corvina";
const i18n = useCorvinaI18n({"en-US": {"message": "EN-Message"}, "it-IT": {"message": "IT-Messaggio"}});

export default {
  name:"MyWidget",
  props: ["wgt"],

  data: function() {
    return {
      myicon: adjustPath( iconPath ),
      i18n: i18n // expose i18n object to template
    }
  },

  computed: {
    widgetStyle() {
      return this.wgt.getStyles();
    }
  }
}
</script>

tip

Is possibile to use separate files for messages. File messages.json:

{"en-US": {"message": "EN-Message"}, "it-IT": {"message": "IT-Messaggio"}}

The JSON file can be imported and used in this way:

import * as messages from "./messages.json";
const i18n = useCorvinaI18n(messages);

i18n API

• t( key, [locale], [values] )

  Arguments:

    - {String} key: required
    - {String} locale: optional
    - {Array | Object} values: optional

  Return: : Translated message.