使用 enduro.js 的降价按钮答案

【问题标题】：button in markdown using enduro.js使用 enduro.js 的降价按钮
【发布时间】：2016-12-15 03:55:12
【问题描述】：

我按照本指南了解如何在 enduro.js 中启用降价：http://www.endurojs.com/docs/using-markdown

这工作正常，但我想要按钮而不是普通的锚链接。我的降价看起来像这样：

## Title
Paragraph text

[read more](/linktofullarticle)

我希望 readmore 链接是 <button> 而不是 <a>

抽象器如下所示：

// placeholder abstractor
var abstractor = function () {}

// vendor dependencies
var marked = require('marked')
marked.setOptions({
    renderer: new marked.Renderer(),
    gfm: true,
    tables: true,
    breaks: false,
    pedantic: true,
    sanitize: true,
    smartLists: true,
    smartypants: false
})

abstractor.prototype.init = function(context) {
    return new Promise(function(resolve, reject) {

        // initialize abstractor
        resolve()
    })
}

abstractor.prototype.abstract = function(context) {
    return new Promise(function(resolve, reject) {

        context['$markdowned_text_hidden'] = true

        // creates the markdowned context
        context.markdowned_text = marked(context.text)

        // abstract directive
        return resolve()

    })
}

module.exports = new abstractor()

注意：我还想保留标准链接，因为有时链接应该是一个按钮，而其他时候应该是一个链接。

【问题讨论】：

标签： javascript markdown enduro.js

【解决方案1】：

我建议您在标准降价之上添加自定义降价规则。

例如，获取按钮的降价可能如下所示

## Title
Paragraph text

..[read more](/linktofullarticle)

然后在你的抽象代码中抓住它并用正则表达式替换：

context.markdowned_text = marked(context.text)
context.markdowned_text = context.markdowned_text
    .replace(/\.\.\[(.*?)\]\((.*?)\)/g, '<a class="btn" href="$2">$1</a>')

注意：在这种情况下使用<button> 可能不起作用，因为您希望用户在单击按钮后重定向。只需使用 <a> 和 class="btn" 并将其设置为按钮。

【讨论】：