How can I include new attribute before render

[erbsutil]

I want to include a new tag, for example: 'rel', but only before rendering on my screen and using react-markdown.

Is that possible?

[ChristianMurphy]

Both new tags and new attributes can be added in react-markdown.
A few ways that could be handled.

• add a component handler for the HTML tag you want to add/modify https://github.com/remarkjs/react-markdown#use-custom-components-syntax-highlight
• Or add a rehype (html AST) plugin to tranform the tag or attribute https://unifiedjs.com/learn/

[erbsutil]

Hi, @ChristianMurphy!

Sorry i wrote wrong, I want to insert a new attribute inside 'a' (links)... Sorry, but I already reading your links, thanks!!!

[ChristianMurphy]

It is possible and the links above are still relevant

[erbsutil]

@ChristianMurphy "#use-custom-components-syntax-highlight", is directly to insert attributs on links in a MD code? I couldn’t understood how it works yet :\

[ChristianMurphy]

It shows how you can use a react element to render an HTML tag.
Which in your case, would be adding a component for the a tag and adding the attribute(s) you want.

[erbsutil]

@ChristianMurphy It worked better for me: https://github.com/remarkjs/react-markdown#appendix-b-components

For example:

<ReactMarkdown
  children="[example](http://www.example.com)"
  components={{
    a: ({ node, ...props }) => (
      <a {...props} rel="noreferrer" />
    ),
  }}
/>

Thanks a lot!