From e9d37a94d36bfea8571ca6147e2f41ee662064a1 Mon Sep 17 00:00:00 2001
From: Pan <panfree23@gmail.com>
Date: Thu, 8 Jun 2017 16:38:25 +0800
Subject: [PATCH] add markdown to html
---
package.json | 1 +
src/views/components/markdown.vue | 13 ++++++++++++-
2 files changed, 13 insertions(+), 1 deletion(-)
diff --git a/package.json b/package.json
index b0c425d7..7a278052 100644
--- a/package.json
+++ b/package.json
@@ -25,6 +25,7 @@
"mockjs": "1.0.1-beta3",
"normalize.css": "3.0.2",
"nprogress": "0.2.0",
+ "showdown": "1.7.1",
"simplemde": "1.11.2",
"sortablejs": "1.5.1",
"vue": "2.3.3",
diff --git a/src/views/components/markdown.vue b/src/views/components/markdown.vue
index 2a73dd58..6893729d 100644
--- a/src/views/components/markdown.vue
+++ b/src/views/components/markdown.vue
@@ -4,6 +4,8 @@
<div class="editor-container">
<MdEditor id='contentEditor' ref="contentEditor" v-model='content' :height="300" :zIndex='20'></MdEditor>
</div>
+ <el-button @click='markdown2Html' style="margin-top:80px;" type="primary">转为HTML<i class="el-icon-document el-icon--right"></i></el-button>
+ <div v-html="html"></div>
</div>
</template>
<script>
@@ -13,7 +15,16 @@
components: { MdEditor },
data() {
return {
- content: 'Simplemde'
+ content: 'Simplemde',
+ html: ''
+ }
+ },
+ methods: {
+ markdown2Html() {
+ import('showdown').then(showdown => {
+ const converter = new showdown.Converter();
+ this.html = converter.makeHtml(this.content)
+ })
}
}
};