vue2渲染代码块markdown

要在Vue2中渲染Markdown代码块，你可以使用vue-markdown插件。首先，你需要将插件安装到你的项目中。你可以使用以下代码将vue-markdown插件引入到你的项目中：

// 在需要用到的地方引入插件
import VueMarkdown from 'vue-markdown'

export default {
  components: {
    VueMarkdown // 注册组件
  },
  data () {
    return {
      mdVal: val // mdVal的值是要解析的markdown数据
    }
  }
}

接下来，你需要在模板中使用`VueMarkdown`组件来渲染Markdown文本。你可以使用以下代码来实现：

<template>
  <div>
    <VueMarkdown :source="mdVal"></VueMarkdown>
  </div>
</template>

这样，你就可以使用vue-markdown插件来渲染Markdown代码块了。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* *2* [Vue怎么渲染Markdown数据](https://blog.csdn.net/weixin_55876727/article/details/121204449)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"]
- *3* [如何在 Vue 中解析和渲染 Markdown](https://blog.csdn.net/weixin_41996102/article/details/120307958)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"]
[ .reference_list ]