Questions tagged [react-intl]

React Components for internationalization. Combines react components with FormatJS.

This library provides React Components and a Mixin to format data and strings, and internationalize your React app.

Features

  • Formats numbers and dates/times, including those in complex messages.
  • Formats relative times (e.g., "3 hours ago").
  • Formats complex messages, including plural and select arguments using ICU Message syntax.
  • Supports custom formatters for numbers and dates/times.

Installation

npm install react-intl
396 questions
0
votes
1 answer

How to validate user input of currency

So I currently developing a website that support many languages. I have an input box where user can input the amount of currency inside. I need a function to validate if that input is legit or not. however, because different countries use different…
Jake Lam
  • 3,254
  • 3
  • 25
  • 44
0
votes
2 answers

How to internationalize ReactJS Web Application including Arabic language?

Looking for something compatible with ReactJS to make my Web Application multilingual along with RTL to LTR and vice-versa. As per my research, I found NPM package called "react-intl" backed by Yahoo using FormatJS is relevant solution.…
Krupal Patel
  • 512
  • 8
  • 12
0
votes
2 answers

return string without any tags

Bear with me I am not sure how to explain this issue. I am using a Bootstrap Table to display my data, I have a searchFilters, sorting and much more functionality in the table. When I began implementing internationalization I started by formatting…
0
votes
1 answer

react-intl FormattedMessage not updating after registering reduxForm

After registering component with reduxForm, react-intl FormattedMessages are not updating after locale change in state: import React from 'react'; import { reduxForm } from 'react-redux-form'; import { Form } from 'reactstrap'; import {…
codeFLOWee
  • 81
  • 2
  • 10
0
votes
1 answer

how to dynamically import languages files data into my APP.js using react_intl

i need to import the data of my selected language in index.js to app.js My index.js import { IntlProvider, addLocaleData } from 'react-intl' import en from 'react-intl/locale-data/en' import fr from 'react-intl/locale-data/fr' import english from…
0
votes
2 answers

Is it possible to reuse `intl` context from IntlProvider?

I have a component (popup) that renders outside of the tree (aka portal), therefore losing the context of IntlProvider: // * <- renders here Redux solves the same issue by allowing to pass…
Pavlo
  • 43,301
  • 14
  • 77
  • 113
0
votes
1 answer

babel-plugin-react-intl - Plugin doesn't seem to do anything

I have installed the babel-plugin-react-intl plugin, and added this to my .babelrc file. I m trying to get the extract messages from my jsx files. My component sources are in ./src { "presets": [ "es2015", "react", "stage-0" ], …
0
votes
2 answers

Changing the date format from DD-MM-YYYY to MM-DD-YYYY using react-intl

I'm using react-intl formatDate to convert the date.I need to get the date in "MM-DD-YYYY" format where as I'm getting it in "DD-MM-YYYY" format.Is there any specific way to achieve this? time value = { MyTime.createdTimestamp } …
Hema Nandagopal
  • 668
  • 12
  • 35
0
votes
1 answer

Formatted message using Complex Message syntax plurar

I try to use FormattedMesage(React intl) to using formatting API. how to create one formatted message, with the plural? Now: const outputTimeOutValues = [ {value:'00:00:01', translationId:'passage.outputTimeOut.oneSecond'}, {value:…
Palaniichuk Dmytro
  • 2,943
  • 12
  • 36
  • 66
0
votes
2 answers

Is it possible to live reload react-intl messages during development

Is it possible to live reload react-intl messages during development(for default language)? I mean like Hot Module Loading, only updated message should be affected. Any ohter solution without running extra script or refreshing whole page will work…
Mohamed
  • 1,251
  • 3
  • 15
  • 36
0
votes
1 answer

React intl to seconds with FormattedTime

I try to convert the '00:00:00', to 0 seconds on UI with React intl. } /> How to…
Palaniichuk Dmytro
  • 2,943
  • 12
  • 36
  • 66
0
votes
1 answer

Pass language as a dynamic property from parent component to all descendants in React

I'm creating multi language app. So I'd like to propagate language property to all descendants. Thus I can ad language prefix to all links and routes in my app I know two ways to do it: using context, but it is not recommended to use it, because it…
Taras Yaremkiv
  • 3,440
  • 7
  • 32
  • 54
0
votes
2 answers

Can't display time as String in react, using intl FormattedTime

I have this code: var message = "The event starts at {1}"; var startTime = ; message = message.replace("{1}", startTime); return (
{message}
Jeremy
  • 5,365
  • 14
  • 51
  • 80
0
votes
1 answer

Testing using enyzme shallow and react-intl with react native

I've been trying to simulate onPress using enzyme shallow render. However I'm unable to access TouchableOpacity due to react-intl I've seen the helper functions for injecting intl into react components, but those seem to only work with React and…
Henry
  • 351
  • 3
  • 12