i18n-chain 2.0 发布 ,支持 TypeScript 的国际化组件

栏目: 软件资讯 · 发布时间: 4年前

内容简介:更新内容 Breakings 数据不再接入一级链条,需要从chain上获取(这种直接使用的场景也较少) - const value = i18n.button.submit; + const value = i18n.chain.button.submit; 删除下划线_,内置方法调整回一...

更新内容

Breakings

  • 数据不再接入一级链条,需要从chain上获取(这种直接使用的场景也较少)
- const value = i18n.button.submit;
+ const value = i18n.chain.button.submit;
  • 删除下划线_,内置方法调整回一级链条
- i18n._.locale('zh');
+ i18n.locale('zh');
  • 删除useI18n,改成从实例获取chain
function App: FC = () => {
- useI18n(i18n);
+ const chain = i18n.use();

  return <div>{chain.button.submit}</div>; 
}
  • 删除高阶组件 I18nProvider,改成从实例获取hoc
class App extends Component {
  render() {
+   const { chain } = this.props; 

-   return <div>{i18n.button.submit}</div>;
+   return <div>{chain.button.submit}</div>;
  }
}

-export default I18nProvider(i18n)(App);
+export default i18n.hoc(App);

Features

  • 新增方法translate,与t一致,都是用于翻译字符串模板
  • 新增字符串模板生成工具
// 跟直接写字符串一样,但是这边是有提示的
const key = i18n.literal.button.submit; // key === 'button.submit'

// 可以使用translate方法获得真实的数据
const value = i18n.translate(key);  // value === 'Submit'

------------------------------------

介绍

说到国际化,你是否也常年奔波于复制粘贴的重复劳动里?像 t('home:submit') t('common:something:success') 这些没有任何提示,需要脑子去记,不仅开发效率低,而且键盘敲快一点就容易打错字母,重点是你基本发现不了这种错误。

我更喜欢有提示的代码,利用typescript,我发明了一种使用链式操作的i18n组件,并拥有所有提示,就类似 i18n.common.something.success 这种,代码可以自动补全,保证不会写错。

兼容性

IE Edge Chrome Firefox Safari Node
9+ 12+ 5+ 4+ 5+ *

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

Head First Web Design

Head First Web Design

Ethan Watrall、Jeff Siarto / O’Reilly Media, Inc. / 2009-01-02 / USD 49.99

Want to know how to make your pages look beautiful, communicate your message effectively, guide visitors through your website with ease, and get everything approved by the accessibility and usability ......一起来看看 《Head First Web Design》 这本书的介绍吧!

在线进制转换器
在线进制转换器

各进制数互转换器

XML、JSON 在线转换
XML、JSON 在线转换

在线XML、JSON转换工具

HEX HSV 转换工具
HEX HSV 转换工具

HEX HSV 互换工具