add markdown to html

This commit is contained in:
Pan 2017-06-08 16:38:25 +08:00
parent 9607d07cc0
commit e9d37a94d3
2 changed files with 13 additions and 1 deletions

View file

@ -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",

View file

@ -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)
})
}
}
};