React-markdown: HTML a tag not rendered correcly

[pke]

Given this JS

import { href } from "cities"
const source = `Go <a href="${href}">here</a>`

<Markdown source={source}/>

The output is not a link but a span with the links "here" only.

[rexxars]

You'll either have to use markdown links ([title](href)) or wait until someone makes a better HTML integration.

[sonaye]

@rexxars Any way around adding target="_blank"?

[ScarellaDev]

@sonaye You can use the renderers option like this:

<Markdown
      source={text}
      renderers={{link : this.markdownLinkRenderer}}
    />

And an example of the markdownLinkRenderer function (I use it to add target="_blank" to non relative links):

markdownLinkRenderer(props) {
    return props.href.startsWith("/") ?
      <a href={props.href}>{props.children}</a> :
      <a href={props.href} target="_blank" rel="nofollow noopener noreferrer">{props.children}</a>;
  }

[brandonstephens]

Appears to work if you take:

const source = `Go <a href="${href}">here</a>`

and make it

const source = `<p>Go <a href="${href}">here</a></p>`

Not sure if this works for your context or not, hope it helps.

[rexxars]

This is fixed in the upcoming 4.0, given you use the HTML parser plugin.