This page covers a non-latest version of Handsontable.
# Setting up a translation in Vue 3
Table of contents
# Overview
The following example shows a Handsontable instance with translations set up in Vue 3.
Find out which Vue 3 versions are supported
# Example
import { createApp } from 'vue';
import { HotTable, HotColumn } from '@handsontable/vue3';
import numbro from 'numbro';
import languages from 'numbro/dist/languages.min.js';
import { registerAllModules } from 'handsontable/registry';
import 'handsontable/dist/handsontable.min.css';
// register Handsontable's modules
registerAllModules();
// register the languages you need
numbro.registerLanguage(languages['ja-JP']);
numbro.registerLanguage(languages['tr-TR']);
const app = createApp({
data() {
return {
formatJP: {
pattern: '0,0.00 $',
culture: 'ja-JP',
},
formatTR: {
pattern: '0,0.00 $',
culture: 'tr-TR',
},
hotData: [
{
productName: 'Product A',
JP_price: 1.32,
TR_price: 100.56,
},
{
productName: 'Product B',
JP_price: 2.22,
TR_price: 453.5,
},
{
productName: 'Product C',
JP_price: 3.1,
TR_price: 678.1,
},
],
settings: {
height: 'auto',
licenseKey: 'non-commercial-and-evaluation'
}
};
},
components: {
HotTable,
HotColumn,
}
});
app.mount('#example1');
# Related articles
# Related guides
# Related API reference
- Configuration options:
- Core methods:
- Hooks: