1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
| <template>
| <div class="myModal">
| <a-modal v-model="visible" title="编辑预览" width="60%" :footer="null"
| :bodyStyle="{'overflow':'overlay','width': '100%','height': '700px'}">
| <div style="display: flex;">
| <a-textarea style="height: 750px;min-width: 50%" v-model="text" />
| <div class="markdown-body article-detail" style="min-width: 50%;border: 1px solid #d9d9d9;">
| <vue-markdown :source="text"></vue-markdown>
| </div>
| </div>
| </a-modal>
| </div>
|
| </template>
|
| <script>
| import VueMarkdown from 'vue-markdown'
|
| import md5 from 'js-md5';
| export default {
| components: {
| VueMarkdown
| },
| data() {
| return {
| visible: false,
| text: "### 十里平湖 \r> ##### (卢照邻) \r> 化自《长安古意》 \r* 十里平湖霜满天 \r* 寸寸青丝愁华年 \r* 对月形单望相护 \r* 只羡鸳鸯不羡仙 \r![](http://blog.inleft.com/photo/example.jpg)",
| }
| },
| methods: {
| getCalendarContainer(trigger) {
| return this.$refs.myModal;
| },
| showModal() {
| this.visible = true;
| },
| handleCancel(e) {
| this.visible = false;
| },
|
| },
| }
| </script>
|
| <style>
| </style>
|
|