Vue如何配置marked鏈接添加target="_blank"

這篇文章將為大家詳細(xì)講解有關(guān)Vue如何配置marked鏈接添加target="_blank"，小編覺得挺實(shí)用的，因此分享給大家做個(gè)參考，希望大家閱讀完這篇文章后可以有所收獲。

1."引入marked

package.json

"dependencies": {
  "marked": "^0.3.9"
}
import marked from "marked";

1.修改生成的HTML的方法

const renderer = new marked.Renderer();
//https://github.com/markedjs/marked/issues/655#issuecomment-383226346
const linkRenderer = renderer.link;
renderer.link = (href, title, text) => {
  const html = linkRenderer.call(renderer, href, title, text);
  return html.replace(/^<a /, '<a target="_blank" ');
};
const html = marked(markdown, { renderer });

Tips:marked參數(shù)配置

const renderer = new marked.Renderer();
//基本設(shè)置
marked.setOptions({
  renderer: renderer,
  gfm: true, //允許 Git Hub標(biāo)準(zhǔn)的markdown.
  tables: true, //允許支持表格語法（該選項(xiàng)要求 gfm 為true）
  breaks: true, //允許回車換行（該選項(xiàng)要求 gfm 為true）
  pedantic: false, //不糾正原始模型任何的不良行為和錯(cuò)誤（默認(rèn)為false）
  sanitize: false, //對(duì)輸出進(jìn)行過濾（清理），將忽略任何已經(jīng)輸入的html代碼（標(biāo)簽）
  smartLists: true, //使用比原生markdown更時(shí)髦的列表
  smartypants: false //使用更為時(shí)髦的標(biāo)點(diǎn)
});

ps：vue實(shí)現(xiàn)類似target="_blank"打開新窗口

//href的{}不能少
let {href} = this.$router.resolve({path:'/applySocSecCard'});
window.open(href, '_blank');

關(guān)于“Vue如何配置marked鏈接添加target="_blank"”這篇文章就分享到這里了，希望以上內(nèi)容可以對(duì)大家有一定的幫助，使各位可以學(xué)到更多知識(shí)，如果覺得文章不錯(cuò)，請(qǐng)把它分享出去讓更多的人看到。