From e0bbe848d3a72e91666c85a1c5351a0e06f532fa Mon Sep 17 00:00:00 2001 From: klausY Date: Wed, 30 Oct 2019 14:36:50 +0800 Subject: [PATCH] =?UTF-8?q?=E5=AF=8C=E6=96=87=E6=9C=AC=20=E7=A4=BA?= =?UTF-8?q?=E4=BE=8B1?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- QMPlusVuePage/package-lock.json | 115 +++++++++++++-------- QMPlusVuePage/package.json | 2 + QMPlusVuePage/src/main.js | 7 ++ QMPlusVuePage/src/view/example/rte/rte.vue | 50 +++++++-- 4 files changed, 123 insertions(+), 51 deletions(-) diff --git a/QMPlusVuePage/package-lock.json b/QMPlusVuePage/package-lock.json index 3f481414..ceb60f8e 100644 --- a/QMPlusVuePage/package-lock.json +++ b/QMPlusVuePage/package-lock.json @@ -3659,7 +3659,6 @@ "version": "1.1.0", "resolved": "https://registry.npm.taobao.org/deep-equal/download/deep-equal-1.1.0.tgz", "integrity": "sha1-MQPN+KttMs9KjfeGVFjyuNM/N0U=", - "dev": true, "requires": { "is-arguments": "^1.0.4", "is-date-object": "^1.0.1", @@ -3772,7 +3771,6 @@ "version": "1.1.3", "resolved": "https://registry.npm.taobao.org/define-properties/download/define-properties-1.1.3.tgz", "integrity": "sha1-z4jabL7ib+bbcJT2HYcMvYTO6fE=", - "dev": true, "requires": { "object-keys": "^1.0.12" } @@ -4879,6 +4877,11 @@ "resolved": "https://registry.npm.taobao.org/fast-deep-equal/download/fast-deep-equal-2.0.1.tgz", "integrity": "sha1-ewUhjd+WZ79/Nwv3/bLLFf3Qqkk=" }, + "fast-diff": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/fast-diff/-/fast-diff-1.1.2.tgz", + "integrity": "sha512-KaJUt+M9t1qaIteSvjc6P3RbMdXsNhK61GRftR6SNxqmhthcd9MGIi4T+o0jD8LUSpSnSKXE20nLtJ3fOHxQig==" + }, "fast-glob": { "version": "2.2.7", "resolved": "https://registry.npm.taobao.org/fast-glob/download/fast-glob-2.2.7.tgz", @@ -5214,8 +5217,7 @@ "ansi-regex": { "version": "2.1.1", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "aproba": { "version": "1.2.0", @@ -5236,14 +5238,12 @@ "balanced-match": { "version": "1.0.0", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "brace-expansion": { "version": "1.1.11", "bundled": true, "dev": true, - "optional": true, "requires": { "balanced-match": "^1.0.0", "concat-map": "0.0.1" @@ -5258,20 +5258,17 @@ "code-point-at": { "version": "1.1.0", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "concat-map": { "version": "0.0.1", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "console-control-strings": { "version": "1.1.0", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "core-util-is": { "version": "1.0.2", @@ -5388,8 +5385,7 @@ "inherits": { "version": "2.0.3", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "ini": { "version": "1.3.5", @@ -5401,7 +5397,6 @@ "version": "1.0.0", "bundled": true, "dev": true, - "optional": true, "requires": { "number-is-nan": "^1.0.0" } @@ -5416,7 +5411,6 @@ "version": "3.0.4", "bundled": true, "dev": true, - "optional": true, "requires": { "brace-expansion": "^1.1.7" } @@ -5424,14 +5418,12 @@ "minimist": { "version": "0.0.8", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "minipass": { "version": "2.3.5", "bundled": true, "dev": true, - "optional": true, "requires": { "safe-buffer": "^5.1.2", "yallist": "^3.0.0" @@ -5450,7 +5442,6 @@ "version": "0.5.1", "bundled": true, "dev": true, - "optional": true, "requires": { "minimist": "0.0.8" } @@ -5531,8 +5522,7 @@ "number-is-nan": { "version": "1.0.1", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "object-assign": { "version": "4.1.1", @@ -5544,7 +5534,6 @@ "version": "1.4.0", "bundled": true, "dev": true, - "optional": true, "requires": { "wrappy": "1" } @@ -5630,8 +5619,7 @@ "safe-buffer": { "version": "5.1.2", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "safer-buffer": { "version": "2.1.2", @@ -5667,7 +5655,6 @@ "version": "1.0.2", "bundled": true, "dev": true, - "optional": true, "requires": { "code-point-at": "^1.0.0", "is-fullwidth-code-point": "^1.0.0", @@ -5687,7 +5674,6 @@ "version": "3.0.1", "bundled": true, "dev": true, - "optional": true, "requires": { "ansi-regex": "^2.0.0" } @@ -5731,14 +5717,12 @@ "wrappy": { "version": "1.0.2", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "yallist": { "version": "3.0.3", "bundled": true, - "dev": true, - "optional": true + "dev": true } } }, @@ -5756,8 +5740,7 @@ "function-bind": { "version": "1.1.1", "resolved": "https://registry.npm.taobao.org/function-bind/download/function-bind-1.1.1.tgz", - "integrity": "sha1-pWiZ0+o8m6uHS7l3O3xe3pL0iV0=", - "dev": true + "integrity": "sha1-pWiZ0+o8m6uHS7l3O3xe3pL0iV0=" }, "functional-red-black-tree": { "version": "1.0.1", @@ -5974,7 +5957,6 @@ "version": "1.0.3", "resolved": "https://registry.npm.taobao.org/has/download/has-1.0.3.tgz", "integrity": "sha1-ci18v8H2qoJB8W3YFOAR4fQeh5Y=", - "dev": true, "requires": { "function-bind": "^1.1.1" } @@ -6615,8 +6597,7 @@ "is-arguments": { "version": "1.0.4", "resolved": "https://registry.npm.taobao.org/is-arguments/download/is-arguments-1.0.4.tgz", - "integrity": "sha1-P6+WbHy6D/Q3+zH2JQCC/PBEjPM=", - "dev": true + "integrity": "sha1-P6+WbHy6D/Q3+zH2JQCC/PBEjPM=" }, "is-arrayish": { "version": "0.2.1", @@ -6690,8 +6671,7 @@ "is-date-object": { "version": "1.0.1", "resolved": "https://registry.npm.taobao.org/is-date-object/download/is-date-object-1.0.1.tgz", - "integrity": "sha1-mqIOtq7rv/d/vTPnTKAbM1gdOhY=", - "dev": true + "integrity": "sha1-mqIOtq7rv/d/vTPnTKAbM1gdOhY=" }, "is-descriptor": { "version": "0.1.6", @@ -6826,7 +6806,6 @@ "version": "1.0.4", "resolved": "https://registry.npm.taobao.org/is-regex/download/is-regex-1.0.4.tgz", "integrity": "sha1-VRdIm1RwkbCTDglWVM7SXul+lJE=", - "dev": true, "requires": { "has": "^1.0.1" } @@ -8017,14 +7996,12 @@ "object-is": { "version": "1.0.1", "resolved": "https://registry.npm.taobao.org/object-is/download/object-is-1.0.1.tgz", - "integrity": "sha1-CqYOyZiaCz7Xlc9NBvYs8a1lObY=", - "dev": true + "integrity": "sha1-CqYOyZiaCz7Xlc9NBvYs8a1lObY=" }, "object-keys": { "version": "1.1.1", "resolved": "https://registry.npm.taobao.org/object-keys/download/object-keys-1.1.1.tgz", - "integrity": "sha1-HEfyct8nfzsdrwYWd9nILiMixg4=", - "dev": true + "integrity": "sha1-HEfyct8nfzsdrwYWd9nILiMixg4=" }, "object-visit": { "version": "1.0.1", @@ -8296,6 +8273,11 @@ "no-case": "^2.2.0" } }, + "parchment": { + "version": "1.1.4", + "resolved": "https://registry.npmjs.org/parchment/-/parchment-1.1.4.tgz", + "integrity": "sha512-J5FBQt/pM2inLzg4hEWmzQx/8h8D0CiDxaG3vyp9rKrQRSDgBlhjdP5jQGgosEajXPSQouXGHOmVdgo7QmJuOg==" + }, "parent-module": { "version": "1.0.1", "resolved": "https://registry.npm.taobao.org/parent-module/download/parent-module-1.0.1.tgz", @@ -9267,6 +9249,41 @@ "integrity": "sha1-YOWl/WSn+L+k0qsu1v30yFutFU4=", "dev": true }, + "quill": { + "version": "1.3.7", + "resolved": "https://registry.npmjs.org/quill/-/quill-1.3.7.tgz", + "integrity": "sha512-hG/DVzh/TiknWtE6QmWAF/pxoZKYxfe3J/d/+ShUWkDvvkZQVTPeVmUJVu1uE6DDooC4fWTiCLh84ul89oNz5g==", + "requires": { + "clone": "^2.1.1", + "deep-equal": "^1.0.1", + "eventemitter3": "^2.0.3", + "extend": "^3.0.2", + "parchment": "^1.1.4", + "quill-delta": "^3.6.2" + }, + "dependencies": { + "clone": { + "version": "2.1.2", + "resolved": "https://registry.npmjs.org/clone/-/clone-2.1.2.tgz", + "integrity": "sha1-G39Ln1kfHo+DZwQBYANFoCiHQ18=" + }, + "eventemitter3": { + "version": "2.0.3", + "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-2.0.3.tgz", + "integrity": "sha1-teEHm1n7XhuidxwKmTvgYKWMmbo=" + } + } + }, + "quill-delta": { + "version": "3.6.3", + "resolved": "https://registry.npmjs.org/quill-delta/-/quill-delta-3.6.3.tgz", + "integrity": "sha512-wdIGBlcX13tCHOXGMVnnTVFtGRLoP0imqxM696fIPwIf5ODIYUHIvHbZcyvGlZFiFhK5XzDC2lpjbxRhnM05Tg==", + "requires": { + "deep-equal": "^1.0.1", + "extend": "^3.0.2", + "fast-diff": "1.1.2" + } + }, "randombytes": { "version": "2.1.0", "resolved": "https://registry.npm.taobao.org/randombytes/download/randombytes-2.1.0.tgz", @@ -9477,7 +9494,6 @@ "version": "1.2.0", "resolved": "https://registry.npm.taobao.org/regexp.prototype.flags/download/regexp.prototype.flags-1.2.0.tgz", "integrity": "sha1-azByTjBqJ4M+6xcbZqyIkLo35Bw=", - "dev": true, "requires": { "define-properties": "^1.1.2" } @@ -11651,6 +11667,15 @@ "vue": "^2.5.21" } }, + "vue-quill-editor": { + "version": "3.0.6", + "resolved": "https://registry.npmjs.org/vue-quill-editor/-/vue-quill-editor-3.0.6.tgz", + "integrity": "sha512-g20oSZNWg8Hbu41Kinjd55e235qVWPLfg4NvsLW6d+DhgBTFbEuMpcWlUdrD6qT3+Noim6DRu18VLM9lVShXOQ==", + "requires": { + "object-assign": "^4.1.1", + "quill": "^1.3.4" + } + }, "vue-router": { "version": "3.1.3", "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-3.1.3.tgz", diff --git a/QMPlusVuePage/package.json b/QMPlusVuePage/package.json index 80c63bef..c62970fe 100644 --- a/QMPlusVuePage/package.json +++ b/QMPlusVuePage/package.json @@ -14,10 +14,12 @@ "node-sass": "^4.12.0", "path": "^0.12.7", "qs": "^6.8.0", + "quill": "^1.3.7", "sass-loader": "^8.0.0", "script-ext-html-webpack-plugin": "^2.1.4", "vue": "^2.6.10", "vue-particle-line": "^0.1.4", + "vue-quill-editor": "^3.0.6", "vue-router": "^3.1.3", "vuescroll": "^4.14.4", "vuex": "^3.1.1", diff --git a/QMPlusVuePage/src/main.js b/QMPlusVuePage/src/main.js index acaf930e..c56d5c23 100644 --- a/QMPlusVuePage/src/main.js +++ b/QMPlusVuePage/src/main.js @@ -12,6 +12,13 @@ import vueParticleLine from 'vue-particle-line' import 'vue-particle-line/dist/vue-particle-line.css' Vue.use(vueParticleLine) +//富文本插件 +import VueQuillEditor from 'vue-quill-editor' +import 'quill/dist/quill.core.css' +import 'quill/dist/quill.snow.css' +import 'quill/dist/quill.bubble.css' + +Vue.use(VueQuillEditor) import '@/permission' import { store } from '@/store/index' diff --git a/QMPlusVuePage/src/view/example/rte/rte.vue b/QMPlusVuePage/src/view/example/rte/rte.vue index dcedb060..bcf870e2 100644 --- a/QMPlusVuePage/src/view/example/rte/rte.vue +++ b/QMPlusVuePage/src/view/example/rte/rte.vue @@ -1,10 +1,48 @@ + \ No newline at end of file + export default { + name: 'App', + data(){ + return { + content: `

hello world

`, + editorOption: {} + } + },computed: { + editor() { + return this.$refs.myQuillEditor.quill; + }, + },methods: { + onEditorReady(editor) { // 准备编辑器 + }, + onEditorBlur(){}, // 失去焦点事件 + onEditorFocus(){}, // 获得焦点事件 + onEditorChange(){}, // 内容改变事件 + saveHtml:function(event){ + alert(this.content); + } + } + } + + + \ No newline at end of file