Language语言国际化

AXUI的语言包存放在src/scripts/lang目录下,默认使用zh-CN简体中文,自带了多国语言包以实现框架国际化;如果需使用本框架没有涵盖的语言可通过对应修改某语言包以实现自定义。语言包使用export default默认导出。

简单使用

AXUI前端框架默认采用中文语言包(zh-CN),内置了英语等其他语言包。如果需要使用其他语言包,可使用以下方法:

 
import ax from './node_modules/@codady/axui/src/script/ax';
import lang from './node_modules/@codady/axui/src/lang/en-US';
ax.lang=lang;

全局配置

如果明确整个项目中都是一种语言,可以修改namespace文件的lang属性,文件路径如下:

 
'./node_modules/@codady/axui/src/script/global/namespace';

自定义语言包

自定义语言包的形式有两种:

  1. 第一种是全局的修改或自定义语言包,即直接修改语言包文件(lang/zh-CN.ts),这样将全局改变AXUI框架的语言。
  2. 第二种是单独设置某实例的lang参数。例如ax.Message模块的参数options.lang可设置实例的默认语言,options.lang可设置的属性可对照语言包中的message属性,这个方式没有全局改变语言包,只是针对某个实例设置了特别的语言包。
 
import ax from './node_modules/@codady/axui/src/script/ax';
new ax.Message({
  content:'test',
  lang:{
    heading: {
            warn: '操作警告!',
            succ: '操作成功!',
            error: '操作失败!',
            issue: '操作疑问!',
            info: '信息提示!',
        },
        content: {
            warn: '警告!运行过程中可能存在故障,请注意排查!',
            succ: '恭喜!运行顺利或者操作成功!',
            error: '失败!运行过程中发生了错误或操作失败!',
            issue: '有疑问!运行过程中遇到一些问题需要解决!',
            info: '提示!运行中未出现状况,请继续!',
        },
  }
})

我们可以通过使用Message模块的lang参数改变默认语言。

  • 输出
  • HTML
  • JS
  •                 
                    
                
  •                 
                    demo0001.onclick = ()=>{
                      new ax.Message().show();
                    }
                    demo0002.onclick = ()=>{
                      new ax.Message({
                        lang:{
                          content:{
                            info:'修改默认info状态的内容',
                          }
                        }
                      }).show();
                    }