From 5e516f8d0271c7df7d69912544fc201323249ef9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=92=83=E7=99=BD?= <18511759309@163.com>
Date: Tue, 22 Jun 2021 19:12:07 +0800
Subject: [PATCH] =?UTF-8?q?feat:=E6=B7=BB=E5=8A=A0getValue/setValue/foucs/?=
=?UTF-8?q?blur=E4=BA=8B=E4=BB=B6=E7=AD=89?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
dist/index.html | 45 ++++++---
dist/markdown-editor.js | 2 +-
package.json | 3 +-
src/App.vue | 103 ++++++++++++++++----
src/assets/js/utils.js | 17 ++++
src/assets/style/font/iconfont.ttf | Bin 4436 -> 4640 bytes
src/assets/style/global.less | 1 +
src/assets/style/iconfont.less | 10 +-
src/components/content/md-textarea.vue | 40 +++++---
src/components/header/md-header.vue | 11 ++-
src/components/header/tool-button.vue | 39 +++++++-
src/main.js | 124 +++++++++++++++++--------
webpack.config.js | 1 +
13 files changed, 301 insertions(+), 95 deletions(-)
diff --git a/dist/index.html b/dist/index.html
index 5944b51..84cd03a 100644
--- a/dist/index.html
+++ b/dist/index.html
@@ -7,7 +7,7 @@
Document
diff --git a/src/main.js b/src/main.js
index 25a8d72..02a761e 100644
--- a/src/main.js
+++ b/src/main.js
@@ -8,8 +8,15 @@ import "@/assets/style/global.less";
Vue.use(Vtip.directive);
function initMdEditor(obj) {
- const {
+ const _this = this;
+ this.value = {
+ text: "",
+ html: ""
+ };
+ this.vEl = "";
+ let {
el,
+ onLoad = () => {},
onChange = () => {},
onUpload = () => {},
onFocus = () => {},
@@ -19,11 +26,11 @@ function initMdEditor(obj) {
placeholder,
value,
zIndex = 2000,
- rule,
- rows = 10,
+ filePathRule,
+ rows = 6,
maxLength,
showWordLimit,
- throttle,
+ throttle = 1000,
canPreview,
canAttachFile,
themeOptions,
@@ -32,45 +39,84 @@ function initMdEditor(obj) {
if (!el || !document.querySelector(el)) throw new Error("请指定容器");
if (isNotEmpty(themeOptions)) initStyle(themeOptions);
if (isNotEmpty(zIndex)) setzIndex(zIndex);
- new Vue({
+ const id = new Date().getTime() + "";
+ const props = {
+ canAttachFile,
+ value,
+ themeOptions,
+ filePathRule,
+ rows,
+ id,
+ throttle,
+ canPreview,
+ toolsOptions,
+ placeholder,
+ maxLength,
+ zIndex,
+ focus: false,
+ showWordLimit
+ };
+ const listeners = {
+ change(val) {
+ onChange(val);
+ _this.value = val;
+ },
+ input(val) {
+ onInput(val);
+ _this.value = val;
+ },
+ load(val) {
+ onLoad(val);
+ _this.value = val;
+ },
+ focus(val) {
+ onFocus(val);
+ _this.value = val;
+ },
+ blur(val) {
+ onBlur(val);
+ _this.value = val;
+ },
+ submit(val) {
+ onSubmit(val);
+ _this.value = val;
+ },
+ upload({ val, callback }) {
+ onUpload(val, function(res) {
+ callback(res);
+ });
+ }
+ };
+ this.vEl = new Vue({
render: h =>
h(App, {
- on: {
- change(val) {
- onChange(val);
- },
- input(val) {
- onInput(val);
- },
- focus(val) {
- onFocus(val);
- },
- blur(val) {
- onBlur(val);
- },
- submit(val) {
- onSubmit(val);
- },
- upload({ val, callback }) {
- onUpload(val, function(res) {
- callback(res);
- });
- }
- },
- props: {
- canAttachFile,
- value,
- rule,
- rows,
- throttle,
- canPreview,
- toolsOptions,
- placeholder,
- maxLength,
- showWordLimit
- }
+ on: listeners,
+ props: props
})
}).$mount(el);
+
+ this.getValue = function(callback) {
+ if (callback) {
+ callback(this.value);
+ }
+ return this.value;
+ };
+
+ this.setValue = function(val) {
+ if (!val) return;
+ props.value = val + "";
+ this.vEl.$forceUpdate();
+ };
+
+ this.focus = function() {
+ props.focus = true;
+ this.vEl.$forceUpdate();
+ };
+
+ this.blur = function() {
+ props.focus = false;
+ this.vEl.$forceUpdate();
+ };
}
window.MdEditor = initMdEditor;
diff --git a/webpack.config.js b/webpack.config.js
index a1830c2..a031c84 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -8,6 +8,7 @@ module.exports = {
},
devServer: {
contentBase: path.resolve(__dirname, "dist"),
+ host: '0.0.0.0',
open: true
},
resolve: {
--
GitLab