Сопоставить все ссылки в соответствии со словарем ключей / значений в компоненте React

#javascript #reactjs #ecmascript-6

#javascript #reactjs #ecmascript-6

Вопрос:

как сопоставить все ссылки в соответствии со словарем ключей / значений.

пример компонента:

 const Error1 = () =>
<>
  <h1>test</h1>
  <p>test <a href="test1">link</a></p>
</>

const Error2 = () =>
<>
  <h1>test</h1>
  <div>test <p><a href="test2">link</a></p></div>
</>

const dictionary = {
 test1: "www.test1.com",
 test2: "www.test2.com"
}
  

// в этом компоненте он хочет указать целевую ссылку

 const RenameLink = ({ children }) => children
  

пример:

 <RenameLink><Error1/></RenameLink>
  

Результат:

 <h1>test</h1>
<p>test <a href="www.test1.com">link</a></p>
  

Комментарии:

1. Какую связь словарь имеет с компонентами ошибок? Это href?

2. @evolutionxbox да, просто href

3. Что вы пробовали? Как насчет использования реквизитов? Как насчет использования React. Children.map?

4. Я попробовал реагировать. Children.map и React.cloneElement но я не знаю, где будет вложен компонент href.

5. Это не компонент. Почему бы не передать значение href в качестве реквизита?