ReactJS: Как я могу передать строку для использования в качестве имени функции?

Question

Я создаю меню с помощью React. Как я могу передать строку компоненту, чтобы использовать ее в качестве имени функции?

Что работает:

<Link to={ROOM({ roomId })}>home</Link>

Я сейчас занимаюсь рефакторингом компонентов. У меня есть компонент MobileMenu со ссылкой, определенной как:

  <MobileMenuLink service={'ROOM'} />

Во втором компоненте я определил MobileMenuLink как:

const MobileMenuLink = ({ style, className, roomId, service }) => {
  return (
    <Base style={style} className={className}>
      <MenuLink>
        <Link to={service({ roomId })}>home</Link>
      </MenuLink>
    </Base>
  )
}

Как это возможно?

Answer 1

Не передавайте строку, передайте функцию ROOM в MobileMenuLink:

<MobileMenuLink service={ROOM} />

И вызовите service, как вы делаете сейчас, потому что это функция:

<Link to={service({ roomId })}>home</Link>