Как безопасно выполнить строку, переданую из пропса?

Question

[antimodern]

Из одного компонента мне надо передать в другой параметр ease

<animate-me ease="Elastic.easeOut.config(1, 0.75)" />

В компоненте мне надо использовать этот пропс. Проблема в том, что он передается строкой

{
  ease: this.ease
}

Соответственно это не работает, поскольку Elastic.easeOut.config(1, 0.75) не выполняется. Как поступить? eval или есть другие варианты?

Answer 1

[0xD34F]

Ничего выполнять не надо, vue всё сделает за вас. Делайте динамическую привязку параметра (убедитесь только, что объект Elastic доступен как свойство компонента):

:ease="Elastic.easeOut.config(1, 0.75)"

Comments

[antimodern]

В родителе нету Elastic, такое не сработает

[0xD34F]

antimodern, ну так добавьте, чтобы сработало.

[0xD34F]

antimodern, ну или eval.

[0xD34F]

antimodern, или попробуйте строку разобрать, если хотите "безопасно". Например:

const exec = str => {
  const
    path = str.slice(0, str.indexOf('(')).split('.'),
    args = str.match(/\((.*)\)/).pop().split(/,\s+/);

  return path.reduce((p, c) => p[c], window)(...args);
};

exec('Elastic.easeOut.config(1, 0.75)')

[antimodern]

0xD34F, если добавлять, то 1) теряется смысл выносить логику в компонент; 2) появляется проблема с SSR

eval получается единственный оставшийся вариант?

[0xD34F]

antimodern, добавил же выше вариант.

[antimodern]

0xD34F, ого, а можно пару пояснений что там происходит в exec()?

[0xD34F]

antimodern, из строки вырезаются имена свойств, и значения параметров. По цепочке имён достаётся функция, вызывается.

[antimodern]

0xD34F, дело в том что помимо Elastic.easeOut.config(1, 0.75) там может передаваться например Bounce.easeOut. Т.е. без аргументов. Эта функция поламается в таком случае?

[antimodern]

А может быть есть библиотеки для таких случаев? Хочется универсальное решение

[0xD34F]

[тяжко вздыхает]

antimodern, может, вам рановато vue использовать? Раз уж знания js у вас нулевые.

Конечно поломается.

[0xD34F]

antimodern, чё-то смеюсь.

Мало того, что ничего не знаете и ничего не умеете - так ещё и не способны вопрос сформулировать нормально. И до кучи возмущаетесь, получив не тот ответ, на который рассчитывали. С головой-то у вас всё хорошо?

[0xD34F]

antimodern,

в чем вопрос сформулирован неправильно?

Подумайте... Хотя нет, не надо - это вы на месяц-другой зависните.

Мне надо перечислить *** возможных комбинаций пропса?

Вы получаете те ответы, которые заслуживаете. Насколько подробно рассказали, чего вам надо - то и получили. Рассказать вы не смогли. Ну, страдайте.

[0xD34F]

antimodern, "обиделся", ё-моё... вам лет-то сколько? Надеюсь, меньше 15, а то совсем беда.

[0xD34F]

antimodern, давайте помогу родиться мысли (это про "множество комбинаций") - может быть строка, содержащая в себе вызов функции, может быть строка с объектом (?). ЧТО ЕЩЁ МОЖЕТ БЫТЬ? Подумайте, это ведь вам виднее.

[Модератор]

antimodern, помощь просят вежливо.