feat: add helper for disabled link, fixed #295 (#296)

Author: QingWei-Li

docs/helpers.md

@@ -57,3 +57,8 @@ You will get `<a href="/demo/">link</a>`html. Do not worry, you can still set ti
 [link](/demo2 ":target=_self")
 ```
 
+## Disable link
+
+```md
+[link](/demo ":disabled")
+```

src/core/render/compiler.js

@@ -25,9 +25,11 @@ export class Compiler {
     if (isFn(mdConf)) {
       compile = mdConf(marked, renderer)
     } else {
-      marked.setOptions(merge(mdConf, {
-        renderer: merge(renderer, mdConf.renderer)
-      }))
+      marked.setOptions(
+        merge(mdConf, {
+          renderer: merge(renderer, mdConf.renderer)
+        })
+      )
       compile = marked
     }
 
@@ -91,33 +93,49 @@ export class Compiler {
     }
     // highlight code
     origin.code = renderer.code = function (code, lang = '') {
-      const hl = Prism.highlight(code, Prism.languages[lang] || Prism.languages.markup)
+      const hl = Prism.highlight(
+        code,
+        Prism.languages[lang] || Prism.languages.markup
+      )
 
       return `<pre v-pre data-lang="${lang}"><code class="lang-${lang}">${hl}</code></pre>`
     }
-    origin.link = renderer.link = function (href, title, text) {
-      let blank = ''
+    origin.link = renderer.link = function (href, title = '', text) {
+      let attrs = ''
+      const config = {}
 
-      if (!/:|(\/{2})/.test(href) &&
+      if (title) {
+        title = title
+          .replace(/:(\w+)=?(\w+)?/g, (m, key, value) => {
+            config[key] = value || true
+            return ''
+          })
+          .trim()
+      }
+
+      if (
+        !/:|(\/{2})/.test(href) &&
         !_self.matchNotCompileLink(href) &&
-        !/(\s?:ignore)(\s\S+)?$/.test(title)) {
+        !config.ignore
+      ) {
         href = router.toURL(href, null, router.getCurrentPath())
       } else {
-        blank = ` target="${linkTarget}"`
-        title = title && title.replace(/:ignore/g, '').trim()
+        attrs += ` target="${linkTarget}"`
+      }
+
+      if (config.target) {
+        attrs += ' target=' + config.target
       }
 
-      let target = title && title.match(/:target=\w+/)
-      if (target) {
-        target = target[0]
-        title = title.replace(target, '')
-        blank = ' ' + target.slice(1)
+      if (config.disabled) {
+        attrs += ' disabled'
+        href = 'javascript:void(0)'
       }
 
       if (title) {
         title = ` title="${title}"`
       }
-      return `<a href="${href}"${title || ''}${blank}>${text}</a>`
+      return `<a href="${href}"${title || ''}${attrs}>${text}</a>`
     }
     origin.paragraph = renderer.paragraph = function (text) {
       if (/^!&gt;/.test(text)) {

src/themes/basic/_layout.css

@@ -75,6 +75,11 @@ img {
   max-width: 100%;
 }
 
+a[disabled] {
+  cursor: not-allowed;
+  opacity: 0.6;
+}
+
 kbd {
   border: solid 1px #ccc;
   border-radius: 3px;