减少层级

Former-commit-id: 889b557de9234ebb4364ebb87f5bf8b0935294eb [formerly 889b557de9234ebb4364ebb87f5bf8b0935294eb [formerly 889b557de9234ebb4364ebb87f5bf8b0935294eb [formerly 889b557de9234ebb4364ebb87f5bf8b0935294eb [formerly 41b59da80ab4c5c0b9eceeec8fd2f527d22c4ab8 [formerly 3dc1bcda38f391962e102a990c2b68b7a33d4683]]]]] Former-commit-id: 3cd64e384a81021adeab4674894f3e4ba934924a Former-commit-id: 6c1d5c80613ac406276127f3b01566ace11becab Former-commit-id: fb1dae74ec5eea07c96632f6e8841b1bc42a614a [formerly 159c5ea89b386d484b2ef90733075633b156d87e] Former-commit-id: 5be175c876d576777072d4430a8520fc7b255112 Former-commit-id: ec65f0871fca703dbbc7a428ca9e4b582043c361 Former-commit-id: 80b73945bd350373ce7e3d15b8f0432c1427d8e3 Former-commit-id: cc2112baadf022e42428dd0019a764e266570b21 Former-commit-id: b7c059087a58e03c0d954af34b30f94b3e03b60c
2018-07-24 15:54:10 +08:00
parent b68419454c
commit 069a571195
24 changed files with 23 additions and 30 deletions
--- a/src/components/d2-mde/index.vue
+++ b/src/components/d2-mde/index.vue
@@ -0,0 +1,61 @@
+<template>
+  <textarea ref="mde"></textarea>
+</template>
+
+<script>
+import SimpleMDE from 'simplemde'
+export default {
+  name: 'd2-mde',
+  props: {
+    // 值
+    value: {
+      type: String,
+      required: false,
+      default: ''
+    },
+    // 配置参数
+    config: {
+      type: Object,
+      required: false,
+      default: () => ({})
+    }
+  },
+  data () {
+    return {
+      // 编辑器实例
+      mde: null,
+      // 编辑器默认参数
+      // 详见 https://github.com/sparksuite/simplemde-markdown-editor#configuration
+      defaultConfig: {
+        autoDownloadFontAwesome: false
+      }
+    }
+  },
+  mounted () {
+    // 初始化
+    this.init()
+  },
+  destroyed () {
+    // 在组件销毁后销毁实例
+    this.mde = null
+  },
+  methods: {
+    // 初始化
+    init () {
+      // 合并参数
+      const config = Object.assign({}, this.defaultConfig, this.config)
+      // 初始化
+      this.mde = new SimpleMDE({
+        ...config,
+        // 初始值
+        initialValue: this.value,
+        // 挂载元素
+        element: this.$refs.mde
+      })
+      this.mde.codemirror.on('change', () => {
+        this.$emit('input', this.mde.value())
+      })
+    }
+  }
+}
+</script>