多语言输入框 FLangInput

用于输入多语言文本的组件，支持多种语言的切换和编辑。

基础用法

点击输入框右侧的地球图标可展开多语言编辑面板。

loading

多行文本

通过 type="textarea" 可以使用多行文本输入。

loading

自定义语言列表

通过 langs 属性可以自定义支持的语言列表。

loading

禁用和只读

支持禁用和只读状态。

loading

语言切换联动

切换当前语言环境时，主输入框会自动显示对应语言的内容。在主输入框输入会同步到弹框中当前语言的输入框。

loading

API

属性

属性	说明	类型	默认值
model-value / v-model	绑定值	LangInputValue	{}
langs	语言配置列表	LangConfig[]	[{ locale: 'zh-CN', label: '中文' }, { locale: 'en-US', label: '英文' }]
placeholder	占位文本	string	—
disabled	是否禁用	boolean	false
readonly	是否只读	boolean	false
clearable	是否可清空	boolean	true
size	尺寸	'large' | 'default' | 'small'	'default'
type	输入框类型	'text' | 'textarea'	'text'
rows	多行文本行数	number	2
maxlength	最大输入长度	number	—
show-word-limit	是否显示字数统计	boolean	false

事件

事件名	说明	参数
change	值改变时触发	(value: LangInputValue)
blur	失去焦点时触发	(event: FocusEvent)
focus	获得焦点时触发	(event: FocusEvent)

类型定义

type LangInputValue = Record<string, string>

interface LangConfig {
  /** 语言标识 */
  locale: string
  /** 语言显示名称 */
  label: string
  /** 提示信息 */
  tooltip?: string
}