视图国际化

当编写 xml 时，会出现很多元信息无关的文案，比如页面上的某些分组标题、前端的校验文案、以及流程中的提示信息。本篇文档会基于这些场景一一描述对应的写法。

纯页面文案

在 xml 中，我们需要写一些页面标题，字段注释，操作提醒等纯前端文案，这些文案的国际化有两种写法：

<!-- 以字段提示为例 -->
<!-- 直接写字符串 -->
<Field name="code" tips="This is code" />

<!-- 等价于 -->
<!-- 用 #{} 表达式的形式，使用 i18n 方法包裹 -->
<Field name="code" tips="#{i18n.get('This is code').d('This is code')}" />

xml 属性支持的用法详见以下表格：

属性名	直接写字符串	写表达式
label	√	√
title	√	√
subtitle	√	√
confirm	√	√
message	√	√
help	√	√
helpText	√	√
placeholder	√	√
tips	√	√
其他属性	×	√

复杂表达式

在某些场景下，我们需要在前端视图中写一些复杂表达式

三元操作符

<View title="#{env.id ? i18n.get('创建').d('创建') : i18n.get('编辑').d('编辑')}" />

数据和国际化拼接

<View title="#{i18n.get('订单号：') + env.id}" />

国际化中含有变量

假设在交付控制台中录入的资源为

那么在 xml 中使用时可以传入变量

<Alert type="normal" message="#{i18n.get('key', {message: message }).d('单据：{message} 保存成功')}"/>

字符串和国际化拼接

<View title="#{i18n.get('订单号') + '详情'}" />

字段属性中

<Field name="warehouse" >
  <RenderType>
    <CascadeModelSelect
      columnTitles="#{[i18n.get('店铺').d('店铺'),i18n.get('仓库').d('仓库')]}"
      leafOnly="#{true}"
      depthLimit="2"
      dataSource="md_SiteBO_ShopWarehouseTree"
      searchCondition="level=2"
      parentField="parentSite"
      hasChildrenField="isLeaf"
      extraFields="siteName"/>
  </RenderType>
</Field>

在 ts 中使用 i18n

import {Controller, Toast} from 'nusi-sdk'

export default class extends Controller {
  someFunction = () => {
    const message = 'td0000001'

    // 操作成功提示
    Toast.success(this.i18n.get('成功').d('成功'))

    // 使用变量
    Toast.success(this.i18n.get('key', {message: message }).d('单据：{message} 保存成功'))

    // 实现某些逻辑
    return this.i18n.get('文案 key').d('默认文案')
  }
}

如果您在使用过程中有不清楚的国际化文案使用场景，可以反馈给 trantor 团队，我们会记录沉淀相应的 case，并更新文档