FormLanguage
Renders a language in FormLanguages components.
Basic Usage
<FormLanguage> component can be used in <FormLanguages> component:
<template>
<Vueform>
<template #empty>
<FormLanguages>
<FormLanguage
language="English"
code="en"
/>
<FormLanguage
language="Chinese"
code="zh"
/>
</FormLanguages>
<FormElements>
<TTextElement
name="title"
label="Title"
/>
<TEditorElement
name="article"
placeholder="Article content..."
/>
</FormElements>
</template>
</Vueform>
</template>Configuration options can be passed over as regular component props. Check out Options section for available configuration options.
Options
Find below the list of options that can use to configure FormLanguage component. Options can be passed to the component via props.
language
- Type:
string - Required:
true
<FormLanguage language="English" ... />The display name of the language.
code
- Type:
string - Required:
true
<FormLanguage code="en" ... />The language code.
view
- Type:
string
<FormLanguage view="alt" ... />The name of the view to be used for the component. If undefined the default view will be used.
Learn more about views here.
Properties
All the data, computed and inject properties of the component.
selectedLanguage
- Type:
string - Group:
computed
The language code of the currently selected language (2 letters).
selected
- Type:
boolean - Group:
computed
Whether the current language is the selected one.
Size
- Type:
string - Group:
inject
The size of the component.
View
- Type:
string - Group:
computed
The name of the resolved view for the component. This one should be used to determine the component's view in class functions.
template
- Type:
object - Group:
computed
The component's template.
classes
- Type:
object - Group:
computed
The component's classes.
theme
- Type:
object - Group:
inject
The global theme object, which contains all the default templates and classes.
form$
- Type:
Vueform - Group:
inject
The root form's component.
Methods
The methods of the component.
select
- Returns:
void
Select the language.
Events
Events emitted by the component.
select
- Params:
{string} language- the selected language
Triggered when the language is selected by the user.
