vue-markdown|基于marked.js的Vue Markdown插件
Vue-markdown是一个基于marked.js的Vue.js插件,用于在Vue应用中渲染Markdown。以下是如何使用vue-markdown的示例代码:
首先,安装vue-markdown:
npm install vue-markdown
然后,在你的Vue组件中引入并使用vue-markdown:
<template>
<vue-markdown>{{ markdownContent }}</vue-markdown>
</template>
<script>
// 引入vue-markdown组件
import VueMarkdown from 'vue-markdown'
export default {
components: { VueMarkdown },
data() {
return {
// 这里是你的Markdown内容
markdownContent: `
# 标题
这是一个例子。
- 列表项A
- 列表项B
`
}
}
}
</script>
在这个例子中,我们创建了一个Vue组件,其中包含了vue-markdown
标签。markdownContent
是一个包含Markdown内容的数据属性,它将被渲染为HTML。
vue-markdown插件还允许你传递额外的选项给marked.js,例如:
<template>
<vue-markdown :source="markdownContent" :toc="true"></vue-markdown>
</template>
在这个例子中,:toc="true"
表示启用目录(Table of Contents)功能。
评论已关闭