Quellcode durchsuchen

富文本编辑器

zhuliu vor 1 Jahr
Ursprung
Commit
125b733bf2
2 geänderte Dateien mit 37 neuen und 32 gelöschten Zeilen
  1. 8 30
      src/utils/model/prosemirror/index.vue
  2. 29 2
      src/utils/model/route.vue

+ 8 - 30
src/utils/model/prosemirror/index.vue

@@ -28,40 +28,16 @@ export default {
         editor:{
 
         },
-        content:{
-            "type": "doc",
-            "content": [
-                {
-                    "type": "paragraph",
-                    "content": [
-                        {
-                            "type": "text",
-                            "text": "fdfcvds"
-                        },
-                        {
-                            "type": "text",
-                            "marks": [
-                                {
-                                    "type": "strong"
-                                }
-                            ],
-                            "text": "fdsc"
-                        },
-                        {
-                            "type": "text",
-                            "text": "dcvd"
-                        }
-                    ]
-                }
-            ]
-        }
+        content:this.value||null
     };
   },
   watch: {
     value(newVal) {  
-        this.content = newVal
-      if (this.editor.view) {  
-        const newState = this.editor.view.state.apply(this.editor.view.state.tr.setDoc(schema.nodeFromJSON(newVal)));  
+      this.content = newVal
+      if (this.editor.view) { 
+        
+        this.editor.view.state.tr.doc = schema.nodeFromJSON(newVal)
+        const newState = this.editor.view.state.apply(this.editor.view.state.tr);  
         this.editor.view.updateState(newState);  
       }  
     },  
@@ -91,9 +67,11 @@ export default {
             }),
             parent: this.$refs.editor, 
             dispatchTransaction(transaction) {
+              console.log(transaction)
                 let newState = that.editor.view.state.apply(transaction)
                 console.log(newState.doc.toJSON())
                 that.editor.view.updateState(newState)
+                that.$emit('input',newState.doc.toJSON())
             }
         })
           // 设置监听器以更新Vue数据  

+ 29 - 2
src/utils/model/route.vue

@@ -36,10 +36,37 @@ export default {
   data() {
     return {
       show:true,
-      content:''
+      content:{
+            "type": "doc",
+            "content": [
+                {
+                    "type": "paragraph",
+                    "content": [
+                        {
+                            "type": "text",
+                            "text": "fdfcvds"
+                        },
+                        {
+                            "type": "text",
+                            "marks": [
+                                {
+                                    "type": "strong"
+                                }
+                            ],
+                            "text": "fdsc"
+                        },
+                        {
+                            "type": "text",
+                            "text": "dcvd"
+                        }
+                    ]
+                }
+            ]
+        }
     };
   },
-  watch: {},
+  watch: {
+  },
   computed: {},
   created() {},
   mounted() {},