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+ *

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

查看所有标签

猜你喜欢:

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

Programming Collective Intelligence

Programming Collective Intelligence

Toby Segaran / O'Reilly Media / 2007-8-26 / USD 39.99

Want to tap the power behind search rankings, product recommendations, social bookmarking, and online matchmaking? This fascinating book demonstrates how you can build Web 2.0 applications to mine the......一起来看看 《Programming Collective Intelligence》 这本书的介绍吧!

JSON 在线解析
JSON 在线解析

在线 JSON 格式化工具

HSV CMYK 转换工具
HSV CMYK 转换工具

HSV CMYK互换工具