Estoy tratando de extraer la parte de la cadena de FormattedMessage para poder acceder a ella y exportarla usando CSV.
Aquí está mi código FormattedMessage ( IntlMessages.js ):
import React from 'react'; import {FormattedMessage, injectIntl} from 'react-intl'; const InjectMassage = props => <FormattedMessage {...props} />; export default injectIntl(InjectMassage, { withRef: false });Para mostrar datos, uso
<IntlMessage id="" /> donde IntlMessage proviene de la declaración de importación del código de FormattedMessage .
import IntlMessage from ./"IntlMessages.js";Obtengo la cadena en función de la identificación que se almacena en un archivo json.
Solo quiero extraer la cadena de IntlMessage para poder manipularla y exportarla como CSV, ya que ahora viene como [object Object] . Estoy usando la tabla de materiales para mostrar datos y es como:
title: <IntlMessage id="" />Soy nuevo en este react-intl y no pude progresar, por lo que me ayudaría si alguien me puede guiar en esto.
EDITAR:
Estoy usando material-table y quiero descargar csv, pero en este momento obtengo encabezados como [object Object] debido solo a IntlMessages . Quiero devolver una cadena al título para que cuando descargue, la cadena aparezca en lugar de [object Object] .
También probé <IntlProvider textComponent={React.Fragment}> pero tampoco funciona.
Use el gancho react-intl llamado useIntl Luego use su método formatMessge
P.ej
Import {useIntl} from 'react-intl' //Hook const intl = useIntl() //Usage intl.formatMessage(message)
Si está usando un componente de clase, puede usar injectIntl HOC para proporcionar el objeto intl a los accesorios, luego use intl.formatMessage({...}) para obtener un título en cadena. El código en su pregunta no funciona porque usa FormattedMessage , que es un componente de reacción (objeto):
const Content = injectIntl(MaterialTableContainer); Y dentro del componente que devuelve MaterialTable :
<MaterialTable columns={[ { title: this.props.intl.formatMessage({ id: "titleId", defaultMessage: "Title" }), field: "name" },Use el gancho de reacción useIntl:
import {useIntl} from 'react-intl'; const intl = useIntl(); const translatedMessage = intl.formatMessage({id: 'messageID'}),