小组件看起来像这样:
// @flow
import ReactMarkdown from "react-markdown";
import type { Node } from "react";
function LinkRenderer(props: any) {
return (
<a href={props.href} target="_blank" rel="noreferrer">
{props.children}
</a>
);
}
type Props = {
children: Node,
};
const MarkdownRenderer = ({ children }: Props) => {
return (
<ReactMarkdown components={{ link: LinkRenderer }}>
{children}
</ReactMarkdown>
);
};
谁能建议为什么我的链接在使用此组件时无法在新标签页中打开?
在其他组件中像这样实现组件:
<MarkdownRenderer>{value}</MarkdownRenderer>
最佳答案
您需要将 prop 从“链接”更新为“a”才能实现。
<ReactMarkdown components={{ a: LinkRenderer}}>
{children}
</ReactMarkdown>
请找到sandbox链接
此外,如果您没有进行过多的自定义并添加自定义渲染器只是为了在新选项卡中打开链接。您可以使用 'linkTarget' 属性并将其设置为 '_blank'
关于javascript - 尽管使用目标 ="_blank",但 React Markdown 链接不会在新选项卡中打开,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/69119798/