首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >在vuejs上自定义markdown解析

在vuejs上自定义markdown解析
EN

Stack Overflow用户
提问于 2021-08-26 07:40:17
回答 1查看 34关注 0票数 0

我在使用libary markdown-it it和parse markdown-it时遇到了问题。我希望当我的formatText \\my_text\\可以更改为斜体。基于markdown-it,当文本想要改变斜体时,使用*italicized text*。在使用library markdown-it或解析其他多种格式的文本时,如何将文本的格式更改为斜体?我的意思是\\my_text\\解析为斜体

代码语言:javascript
复制
//my code markdown-it , use mixin vue
const MarkdownIt = require('markdown-it')
const md = new MarkdownIt({
    html: true,
    linkify: true,
    typographer: true
});

export default {
    methods: {
        marked(payload: string): string {
            if (payload) return this.parse(md.render(payload));
            return "";
        },
        parse(payload: string, type: any = "") {
            const parser = new DOMParser();
            const htmlDoc = parser.parseFromString(payload, "text/html");
            const links = htmlDoc.querySelectorAll("a");
            links.forEach(link => {
                link.setAttribute("target", "_blank");
                link.classList.add(
                    "hover:underline",
                    "hover:text-orange",
                    "text-indigo-200"
                );
            });
            if (type === "commentTask") {
                const divs = htmlDoc.querySelectorAll(
                    ".phabricator-remarkup-embed-layout-link"
                );
                divs.forEach(div => {
                    const url = div.attributes.item(0)?.value;
                    div.classList.add("border", "border-red-300", "p-2", "w-72", "mt-2");
                    const spans = div.querySelectorAll(
                        ".phabricator-remarkup-embed-layout-name"
                    );
                    spans.forEach(span => {
                        const newA = htmlDoc.createElement("a");
                        newA.classList.add("hover:text-orange", "mr-1", "pr-1");
                        newA.innerHTML = span.innerHTML;
                        newA.setAttribute("href", url as string);
                        newA.setAttribute("target", "_blank");
                        span.innerHTML = "";
                        span.appendChild(newA);
                    });
                    const as = div.querySelectorAll(
                        ".phabricator-remarkup-embed-layout-download"
                    );
                    as.forEach(a => {
                        a.classList.add("ml-2");
                        a.removeAttribute("target");
                    });
                });
            }
            return htmlDoc.documentElement.innerHTML;
        }
    }
};
代码语言:javascript
复制
<!-- my code use vueJS, Vuejs mixins-->
<div
                id="vue-html"
                class="text-sm p-4 overflow-y-auto text-black border-2 mt-3"
                style="max-height: 30rem"
                v-html="marked(data)"
            />

EN

回答 1

Stack Overflow用户

发布于 2021-08-26 07:52:21

您不能将\替换为*吗

代码语言:javascript
复制
marked(payload: string): string {
            if (payload) return this.parse(md.render(payload.replace(/\\\\/g, '*')));
            return "";
        }
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/68934462

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档