سلام
در مورد چند زبانه کردن react redux بهترین package چی هستش، و اینکه کسی نمونه کدش رو داره که بتونم الگو برداری کنم
پکیجهای زیر:
https://www.npmjs.com/package/react-localize-redux
https://www.npmjs.com/package/react-redux-multilingual
https://github.com/stssoftware/redux-multilanguage
https://github.com/yahoo/react-intl
من از بین این موارد با "react-redux-multilingual" کار کردم لایبرری کوچک (۶ KB) و کارآمدیه
برای نصب:
npm i react-redux-multilingual --save
لود کردن پکیج:
import translations from './translations'
import { IntlReducer as Intl, IntlProvider } from 'react-redux-multilingual'
import { createStore, combineReducers } from 'redux'
import { Provider } from 'react-redux'
import App from './App'
let reducers = combineReducers(Object.assign({}, { Intl }))
let store = createStore(reducers)
ReactDOM.render(
<Provider store={store}>
<IntlProvider translations={translations} locale='fa'>
<App />
</IntlProvider>
</Provider>
, document.getElementById('root'))
فرمت ترجمه:
پراپ translations بالا آبجکتی با این فرمت رو نیز داره:
{
en: {
locale: 'en-US',
messages: {
hello: 'Hello {name}'
}
},
fa: {
locale: 'fa-IR',
messages: {
hello: 'سلام {name}'
}
}
}
طریقه استفاده:
۱:
import { withTranslate } from 'react-redux-multilingual'
const App = ({ translate }) = {
return (
<div>
{translate('hello', { name: 'John Doe' })}
</div>
)
}
module.exports = withTranslate(App)
۲:
const App = (props, context) => {
return (
<div>
{context.translate('hello', { name: 'John Doe' })}
</div>
)
}
App.contextTypes = {
translate: React.propTypes.func
}
module.exports = App
تنظیم زبان پیشفرض:
۱: زبان پیش فرض رو به استیت آغازین در ردوسر پاس بدید.
let store = createStore(reducers, { Intl: { locale: 'fa'}})
۲: از طریق دیسپچکردن:
import { IntlActions } from 'react-redux-multilingual'
let store = createStore(reducers)
store.dispatch(IntlActions.setLocale('fa'))
آیا مایل به ارسال نوتیفیکیشن و اخبار از طرف راکت هستید ؟