Accept keys with period (".")

[formatjs]

Accept keys with period (".")

[caridy]

hmm, this is going to be problematic to achieve because it is ambiguous, and supporting namespacing is paramount for complex apps (like those we have here at yahoo). give us some time to think about this.

[ericf]

Using getIntlMessage() is completely optional; it's simply for convenience. As @caridy mentioned this is ambiguous so there's no way for us to cater to both use cases.

If you have message keys that contain dots, then you could access the message like this:

var messages = this.props.messages || this.context.messages;
var message  = messages['foo.bar'];

[vafada]

I understand i can do that and that's what exactly i did. The problem I have to create my own mixin, extend react-intl and shim it instead of just working out of the box 😢

[ericf]

Can you simply create a mixin that overrides getIntlMessage() that's provided by ReactIntlMixin by simply adding yours after in the list of mixins? I don't see why you need to extend react-intl.

We've documented getIntlMessage() as taking a string path/namespace (although we could make it more clear.) Since we have the ambiguity issue, what could we do to help make it easier for you to access your messages?

[vafada]

Can you simply create a mixin that overrides getIntlMessage() that's provided by ReactIntlMixin by simply adding yours after in the list of mixins? I don't see why you need to extend react-intl.

Oh didn't knew you can do that. I can try it out and just document in our project that the ReactIntlMixin shoould come before our own mixin in the React.mixins properties. Anyways, thanks for help.

[vafada]

@ericf I know i'm beating a dead horse but React doesn't allow to override mixin methods.

Uncaught Error: Invariant Violation: ReactCompositeComponentInterface: You are attempting to define getIntlMessage on your component more than once. This conflict may be due to a mixin.

I'll probably add a new method on react-inl, something like:

var reactIntl = require('react-intl');
reactIntl.getValue = function() {
    var messages = this.props.messages || this.context.messages;
    return messages['foo.bar'];
}

module.exports = reactIntl;

is there a better way to do this besides the code above?

[pselden]

@vafada I'd probably go for the extending the mixin route instead of shimming the react intl mixin itself.

I think you could do something like this:

// MyIntlMixin.js
var assign = require('object-assign');
var ReactIntlMixin = require('react-intl');

var MyIntlMixin = assign(ReactIntlMixin, {
   getIntlMessage: function(path) { /* my specific implementation, overriding the old one */ },
   getLocalizedMessage: function(path) { /* my specific implementation, adding a new method */ }
});

module.exports = MyIntlMixin;

Then use MyIntlMixin instead of ReactIntlMixin.

[ericf]

@pselden makes sense. @vafada is there a reason why you like having dots in your string message keys? :)

[vafada]

@pselden looks goods! thanks!

@ericf leveraging existing api / legacy api support. I actually like the namespace/nested keys but need to work with existing api. 😢