IntlField 多语言输入框

多语言表单控件。

何时使用

当用户需要输入多语言说明，可以点击图标，弹出对应多语言输入列表进行输入。

代码演示

数据源

绑定数据源。

IntlField多语言输入框 - 图1

  1. ​
  2. import React from 'react';
  3. import ReactDOM from 'react-dom';
  4. import { DataSet, IntlField, Row, Col } from 'choerodon-ui/pro';
  5. ​
  6. function handleDataSetChange({ record, name, value, oldValue }) {
  7.   console.log(
  8.     '[dataset newValue]',
  9.     value,
  10.     '[oldValue]',
  11.     oldValue,
  12.     `[record.get('${name}')]`,
  13.     record.get(name),
  14.   );
  15. }
  16. ​
  17. class App extends React.Component {
  18.   ds = new DataSet({
  19.     primaryKey: 'pk',
  20.     data: [{ 'first-name': '吴' }],
  21.     tlsUrl: '/dataset/user/languages',
  22.     fields: [
  23.       {
  24.         name: 'first-name',
  25.         type: 'intl',
  26.         defaultValue: 'Zhangsan',
  27.         required: true,
  28.       },
  29.       {

API

参数说明类型
modalProps弹窗属性，详见ModalPropsobject
maxLengths多语言弹窗内选项输入最大长度(主语言 Field maxLength 配置优先)object

更多属性请参考 ViewComponent。