1

I retrieve content from a CMS system (WordPress). In the "page.content" variable, links are outputted like so: <a href="#">. How can I replace this content with: <nuxt-link to="#"> on the client side?

The question has been asked before, but no real answers: https://github.com/nuxt/nuxt.js/issues/2912 - despite this must be a pretty regular usecase.

FooBar
  • 5,752
  • 10
  • 44
  • 93
  • Does this answer your question? [change HTML tag name using Pure JS](https://stackoverflow.com/questions/29489160/change-html-tag-name-using-pure-js) – phuzi Mar 12 '20 at 11:58

1 Answers1

2

Simple string replacement should suffice.

const string =  'links are outputted like so: <a href="#">. How can I replace this content with: <nuxt-link to="#">'

const converted = string.replace(/<a/g, '<nuxt-link').replace(/href=/g, 'to=');

console.log(converted)
GBWDev
  • 576
  • 5
  • 18
  • This will only replace one link in the whole string, to replace all, there must be a global regex `/g` in the replace: `string.replace(/ – Michael B. Mar 17 '20 at 08:37
  • @GBWDev - I am not sure the component is rendered, if you simply do it this way. is a component. – FooBar Mar 18 '20 at 13:55