Как в общем случае написать метод ярлыка для компонентов React.js с декораторами?

Я использую React Intl для интернализации и должен написать this.props.intl.formatMessage({id: 'some.message.id'}, values) чтобы получить переведенную строку в методе render (). Теперь, как должен выглядеть декоратор, предоставляющий для этого функцию быстрого доступа, чтобы я мог делать что-то вроде _t('some.message.id', values) или что-то подобное?

Я знаю, что, вероятно, мог бы просто написать другой класс, расширяющий React.Component, или обернуть компонент в другой класс, или что-то еще, но я бы хотел сделать это с помощью декораторов (для обучения и понимания), если это возможно.


reactjs javascript react-intl decorator
person Maxim Zubarev    schedule 06.09.2016    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Вот что вам нужно для начала:

function mydecorator(target, key, descriptor) {
  const method = descriptor.value;

  descriptor.value = function(...args) {
    args.push(this.props.intl.formatMessage); // may need `.bind(...)`
    return method.apply(this, args);
  }
}

Использовать:

@mydecorator
render(_t) {
  ...
}

Декоратор заменяет render функцией, которая помещает ссылку на this.props.intl.formatMessage в список аргументов, которые впоследствии передаются при вызове исходного render (который, AFAIK, не принимает аргументов, поэтому вы, вероятно, можете сократить код, вынув переменная args).

Конечно, вы можете использовать промежуточную функцию в качестве аргумента, которая будет лучше обрабатывать аргумент id и т. Д.

person robertklep    schedule 06.09.2016