我需要使文本中的所有链接打开一个新标签页,而文本来自dangerouslySetInnerHTML={{__html:content,}}.代码在一个新的类中,它扩展了react中的组件,该代码块是我在其中拾取文本id的代码块< section>
laximzn51#
只需添加rel="noopener noreferrer"即可解决您的问题。https://caniuse.com/?search=noopener%20
rel="noopener noreferrer"
<a href="https://hasantezcan.dev" target="_blank" rel="noopener noreferrer">Go to website</a>
源
zhte4eai2#
下面是我使用replace的解决方案
replace
var content = `<a href="https://stackoverflow.com">Stack Overflow</a><a href="https://google.com">Google</a>`; class App extends React.Component { render(){ return ( <div dangerouslySetInnerHTML={{ __html: content.replace(/href/g, "target='_blank' href") }}> </div> ) } }
f5emj3cl3#
<Link to="route" target="_blank" onClick={(event) => {event.preventDefault(); window.open(this.makeHref("Your_route"));}} />
我是说
<Link ... target="_blank">
或
<a target='_blank' href={'Your_url'})}>Your Text</a>
h7appiyu4#
您可以用途:
<Link to="route" target="_blank" onClick={(event) => {event.preventDefault(); window.open(this.makeHref("route"));}} />
请参考React-Router open Link in new tab
rryofs0p5#
// to fix error in your console <a target="_blank" rel="noreferrer" href={"url_link"}>Text</a>
5条答案
按热度按时间laximzn51#
只需添加
rel="noopener noreferrer"
即可解决您的问题。https://caniuse.com/?search=noopener%20
源
zhte4eai2#
下面是我使用
replace
的解决方案f5emj3cl3#
我是说
或
h7appiyu4#
您可以用途:
请参考React-Router open Link in new tab
rryofs0p5#