JavaScript - 从 JSON 数组获取数据时，用锚标记替换字符串

Question

I have encountered this problem while doing loop over array of objects. Consider I have below array of objects.

General : [
       {
          question: 'Whats you suggestion?',
          answer: "Before you go ahead and book one of our trusted developer, please read our FAQ.",
       },
       {
          question: 'Do you have guaranteed solution?',
          answer: 'Please let us know at hello@stackoverflow.com.',
       }
     ]

I am using map in my JSX (react application) something like this.

General.map((faq, index) => (
        <details>
          <summary>{faq.question}</summary>
          <div>
            <Linkify>{faq.answer}</Linkify>
          </div>
        </details>
      ))}

Now I want the text hello@stackoverflow.com to render as html anchor tag. I have done this through React Linkify . But how we can achieve this with pure javascript?

Answer 1

This will work for emails, but you'll need to work out the regex for urls and chain them. Hope it helps.

General.map((faq, index) => {
  const emailRegex = /([a-zA-Z0-9._-]+@[a-zA-Z0-9._-]+\.[a-zA-Z0-9._-]+)/g;
  const emailReplacer = "<a href='mailto:$1'>$1</a>";
  return (
    <details>
      <summary>{faq.question}</summary>
      <div>
        <div>
          {faq.answer.replace(emailRegex, emailReplacer)}
        </div>
      </div>
    </details>
  )
})