Skip to content

Commit

Permalink
添加了一个在编辑器外渲染markdown的例子 (hinesboy#612)
Browse files Browse the repository at this point in the history
Added an example about how to render markdown
icepear-jzx authored Dec 2, 2021
1 parent 38079d5 commit bf97a96
Showing 2 changed files with 70 additions and 2 deletions.
36 changes: 35 additions & 1 deletion doc/cn/markdown.md
Original file line number Diff line number Diff line change
@@ -34,4 +34,38 @@
markdownIt.set({ breaks: false });
```

> [更多设置参考markdown-it...](https://github.com/markdown-it/markdown-it)
> [更多设置参考markdown-it...](https://github.com/markdown-it/markdown-it)
### 简单示例

> 注意:`class="markdown-body"` 是必要的,否则CSS样式会于预览的不一样
```html
<template>
<div>
<span class="markdown-body" v-html="rawHtml"></span>
</div>
</template>

<script>
import { mavonEditor } from 'mavon-editor';
import "mavon-editor/dist/css/index.css";
export default {
name: 'Example',
data() {
return {
rawHtml: '',
};
},
props: {
markdown: String,
},
  computed: {
    rawHtml: function() {
      return mavonEditor.mixins[0].data().markdownIt.render(this.markdown);
    }
  },
};
</script>
```
36 changes: 35 additions & 1 deletion doc/en/markdown.md
Original file line number Diff line number Diff line change
@@ -34,4 +34,38 @@
markdownIt.set({ breaks: false });
```

> [markdown-it API](https://github.com/markdown-it/markdown-it)
> [markdown-it API](https://github.com/markdown-it/markdown-it)
### Simple example

> Notice:`class="markdown-body"` is necessary, or the CSS style will be different from the preview
```html
<template>
<div>
<span class="markdown-body" v-html="rawHtml"></span>
</div>
</template>

<script>
import { mavonEditor } from 'mavon-editor';
import "mavon-editor/dist/css/index.css";
export default {
name: 'Example',
data() {
return {
rawHtml: '',
};
},
props: {
markdown: String,
},
  computed: {
    rawHtml: function() {
      return mavonEditor.mixins[0].data().markdownIt.render(this.markdown);
    }
  },
};
</script>
```

0 comments on commit bf97a96

Please sign in to comment.