redux-lexicon v0.8.0
redux-lexicon
React / Redux localization tool
Installation
npm install redux-lexicon --save
Api
reducer
currentLang reducer
setLang
update currentLang action creator
withLexContext( mapStateToLang, mapStateToLexicon, defLang = 'en' )( WrappedComponent )
HOC - add lexicon context to App component mapStateToLang - currentLang selector mapStateToLexicon - lexicon selector defLang - default lang
withLex( componentKey )(WrappedComponent)
HOC - add lex prop to WrappedComponent componentKey - optional, get only componentKey fields from lexicon
withLex()(YouCmp)
withLex('YouCmp')(YouCmp)
withLex('YouCmp', 'OtherCmp')(YouComp)
withLex('YouCmp', 'FerstCmp', 'SecondCmp')(YouComp)
Usage
connect lexicon and currentLang reducers to redux store
You can take currentLang reducer and setLang action from this package
data format from lexicon reducer:
{ en: { component1: { key1: "en translate", key2: "en translate" }, component2: { key1: "en translate" } }, ru: { component1: { key1: "ru translate", key2: "ru translate" }, component2: { key1: " ru translate" } } }
wrap you root component withLexContext
import { withLexContext } from 'redux-lexicon' class App extends Component { ... } const enhanceLexContext = withLexContext( state => state.lang, state => state.lexicon ) export default enhanceLexContext(App)
wrap you translate component withLex
import { withLex } from 'redux-lexicon' class YouComponent extends Component { ... } const enhanceLex = withLex('youComponent') export default enhanceLex(YouComponent)
get translate strings from lex prop in YouComponent
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago