Link to translate string

[knapeto]

Hello,

I dont know how I can translate string with my component for example:

module.exports = {
    i_agree_to_the_terms_of_user: "Souhlasím s <Link onClick={this.toUrl}>podmínkami užití</Link>"
};

Thanks you for your component!

[martinandert]

The example shows how to do this. It basically goes down to this:

In locales:

module.exports = {
   i_agree_to_the_terms_of_user: "Souhlasím s %(termsLink)s",
   terms_link_text: "podmínkami užití"
};

In component:

var termsLink = <Translate component={Link} onClick={this.toUrl} content="terms_link_text" />;
return <Translate termsLink={termsLink} content="i_agree_to_the_terms_of_user" />;

[knapeto]

Hey I have a similar problem for this solution. when I use your plugin..

COMPONENT:
 var termsLink = <Link to="terms" onClick={this._handleCloseModal}><Translate content="terms_link_text" /></Link>;

<Translate termsLink={termsLink} content="i_agree_to_the_terms_of_user" />

LANG:
terms_link_text: "podmínkami užití",

In my console browser I have warning:

Warning: owner-based and parent-based contexts differ (values: `function (props, context) {
      // This constructor is overridden by mocks. The argument is used
      // by mocks to assert on what gets mounted.

      if ("production" !== process.env.NODE_ENV) {
        ("production" !== process.env.NODE_ENV ? warning(
          this instanceof Constructor,
          'Something is calling a React component directly. Use a factory or ' +
          'JSX instead. See: http://fb.me/react-legacyfactory'
        ) : null);
      }

      // Wire up auto-binding
      if (this.__reactAutoBindMap) {
        bindAutoBindMethods(this);
      }

      this.props = props;
      this.context = context;
      this.state = null;

      // ReactClasses doesn't have constructors. Instead, they use the
      // getInitialState and componentWillMount methods for initialization.

      var initialState = this.getInitialState ? this.getInitialState() : null;
      if ("production" !== process.env.NODE_ENV) {
        // We allow auto-mocks to proceed as if they're returning null.
        if (typeof initialState === 'undefined' &&
            this.getInitialState._isMockFunction) {
          // This is probably bad practice. Consider warning here and
          // deprecating this convenience.
          initialState = null;
        }
      }
      ("production" !== process.env.NODE_ENV ? invariant(
        typeof initialState === 'object' && !Array.isArray(initialState),
        '%s.getInitialState(): must return an object or null',
        Constructor.displayName || 'ReactCompositeComponent'
      ) : invariant(typeof initialState === 'object' && !Array.isArray(initialState)));

      this.state = initialState;
    }` vs `undefined`) for key (router) while mounting Link (see: http://fb.me/react-context-by-parent)

[martinandert]

@knapeto react-translate-component doesn't use React's context. From the warning it appears to have something to do with a router key.