关于nuxt.js:nuxt-使用-markdown组件

简略介绍一下，在nuxt里 援用 vue-markdown 组件。
组件Git 地址：https://github.com/miaolz123/...

1，装置

NPM

$ npm install --save vue-markdown

Yarn

$ yarn add vue-markdown --save

2，应用

2.1，新建 vue-markdown 文件
在 plugins 下，新建 vueMarkdown 文件，引入装置的组件

import Vue from 'vue';import VueMarkdown from 'vue-markdown';Vue.component("VueMarkdown", VueMarkdown);

2.2， 在nuxt.config.js 里调用 vueMarkdown 文件

plugins: [    '~/plugins/vueMarkdown'  ],

2.3，在须要的页面调用

<template>  <div>    <el-input v-model="source" type="textarea"></el-input>    <vue-markdown id="markdown" :source="source"></vue-markdown>  </div></template>

成果如下图所示：

在文本域里编写 markdown 格局的文本，组件就会主动解析并进行展现。
如果，想要批改其中的款式，须要定位具体的地位。
我是采纳 /deep/ 的形式进行定位。

#markdown /deep/ p {  color: rgb(17, 180, 139)}