提交 087f696f 编写于 作者: 璃白.'s avatar 璃白. 🌻

fix

上级 7dfee441
文件已添加
(self.webpackChunkmarkdown_editor=self.webpackChunkmarkdown_editor||[]).push([[164],{794:(e,n,l)=>{"use strict";l.d(n,{Z:()=>i});var r=l(3645),s=l.n(r)()((function(e){return e[1]}));s.push([e.id,"/*\n\nAtom One Dark by Daniel Gamage\nOriginal One Dark Syntax theme from https://github.com/atom/one-dark-syntax\n\nbase: #282c34\nmono-1: #abb2bf\nmono-2: #818896\nmono-3: #5c6370\nhue-1: #56b6c2\nhue-2: #61aeee\nhue-3: #c678dd\nhue-4: #98c379\nhue-5: #e06c75\nhue-5-2: #be5046\nhue-6: #d19a66\nhue-6-2: #e6c07b\n\n*/\n.md_preview .md_hljs {\n color: #abb2bf;\n background: #282c34;\n}\n.md_preview .hljs-comment,\n.md_preview .hljs-quote {\n color: #5c6370;\n font-style: italic;\n}\n.md_preview .hljs-doctag,\n.md_preview .hljs-keyword,\n.md_preview .hljs-formula {\n color: #c678dd;\n}\n.md_preview .hljs-section,\n.md_preview .hljs-name,\n.md_preview .hljs-selector-tag,\n.md_preview .hljs-deletion,\n.md_preview .hljs-subst {\n color: #e06c75;\n}\n.md_preview .hljs-literal {\n color: #56b6c2;\n}\n.md_preview .hljs-string,\n.md_preview .hljs-regexp,\n.md_preview .hljs-addition,\n.md_preview .hljs-attribute,\n.md_preview .hljs-meta .hljs-string {\n color: #98c379;\n}\n.md_preview .hljs-attr,\n.md_preview .hljs-variable,\n.md_preview .hljs-template-variable,\n.md_preview .hljs-type,\n.md_preview .hljs-selector-class,\n.md_preview .hljs-selector-attr,\n.md_preview .hljs-selector-pseudo,\n.md_preview .hljs-number {\n color: #d19a66;\n}\n.md_preview .hljs-symbol,\n.md_preview .hljs-bullet,\n.md_preview .hljs-link,\n.md_preview .hljs-meta,\n.md_preview .hljs-selector-id,\n.md_preview .hljs-title {\n color: #61aeee;\n}\n.md_preview .hljs-built_in,\n.md_preview .hljs-title.class_,\n.md_preview .hljs-class .hljs-title {\n color: #e6c07b;\n}\n.md_preview .hljs-emphasis {\n font-style: italic;\n}\n.md_preview .hljs-strong {\n font-weight: bold;\n}\n.md_preview .hljs-link {\n text-decoration: underline;\n}\n",""]);const i=s},164:(e,n,l)=>{"use strict";l.r(n),l.d(n,{default:()=>t});var r=l(3379),s=l.n(r),i=l(794);s()(i.Z,{insert:"head",singleton:!1});const t=i.Z.locals||{}}}]);
\ No newline at end of file
(self.webpackChunkmarkdown_editor=self.webpackChunkmarkdown_editor||[]).push([[345],{7967:(e,n,l)=>{"use strict";l.d(n,{Z:()=>s});var r=l(3645),i=l.n(r)()((function(e){return e[1]}));i.push([e.id,"/*\n\nLightfair style (c) Tristian Kelly <tristian.kelly560@gmail.com>\n\n*/\n.md_preview .md_hljs {\n color: #444;\n background: var(--md-editor-code-bg-color);\n}\n.md_preview .hljs-name {\n color: #01a3a3;\n}\n.md_preview .hljs-tag,\n.md_preview .hljs-meta {\n color: #778899;\n}\n.md_preview .hljs-subst {\n /* default */\n}\n.md_preview .hljs-comment {\n color: #888888;\n}\n.md_preview .hljs-keyword,\n.md_preview .hljs-attribute,\n.md_preview .hljs-selector-tag,\n.md_preview .hljs-meta .hljs-keyword,\n.md_preview .hljs-doctag,\n.md_preview .hljs-name {\n font-weight: bold;\n}\n.md_preview .hljs-type,\n.md_preview .hljs-string,\n.md_preview .hljs-number,\n.md_preview .hljs-selector-id,\n.md_preview .hljs-selector-class,\n.md_preview .hljs-quote,\n.md_preview .hljs-template-tag,\n.md_preview .hljs-deletion {\n color: #4286f4;\n}\n.md_preview .hljs-title,\n.md_preview .hljs-section {\n color: #4286f4;\n font-weight: bold;\n}\n.md_preview .hljs-regexp,\n.md_preview .hljs-symbol,\n.md_preview .hljs-variable,\n.md_preview .hljs-template-variable,\n.md_preview .hljs-link,\n.md_preview .hljs-selector-attr,\n.md_preview .hljs-selector-pseudo {\n color: #bc6060;\n}\n.md_preview .hljs-literal {\n color: #62bcbc;\n}\n.md_preview .hljs-built_in,\n.md_preview .hljs-bullet,\n.md_preview .hljs-code,\n.md_preview .hljs-addition {\n color: #25c6c6;\n}\n.md_preview .hljs-meta .hljs-string {\n color: #4d99bf;\n}\n.md_preview .hljs-emphasis {\n font-style: italic;\n}\n.md_preview .hljs-strong {\n font-weight: bold;\n}\n",""]);const s=i},8345:(e,n,l)=>{"use strict";l.r(n),l.d(n,{default:()=>d});var r=l(3379),i=l.n(r),s=l(7967);i()(s.Z,{insert:"head",singleton:!1});const d=s.Z.locals||{}}}]);
\ No newline at end of file
(self.webpackChunkmarkdown_editor=self.webpackChunkmarkdown_editor||[]).push([[380],{9721:(e,n,l)=>{"use strict";l.d(n,{Z:()=>s});var r=l(3645),i=l.n(r)()((function(e){return e[1]}));i.push([e.id,"/*\n\nDark style from softwaremaniacs.org (c) Ivan Sagalaev <Maniac@SoftwareManiacs.Org>\n\n*/\n.md_preview .md_hljs {\n color: #ddd;\n background: #444;\n}\n.md_preview .hljs-keyword,\n.md_preview .hljs-selector-tag,\n.md_preview .hljs-literal,\n.md_preview .hljs-section,\n.md_preview .hljs-link {\n color: white;\n}\n.md_preview .hljs-subst {\n /* default */\n}\n.md_preview .hljs-string,\n.md_preview .hljs-title,\n.md_preview .hljs-name,\n.md_preview .hljs-type,\n.md_preview .hljs-attribute,\n.md_preview .hljs-symbol,\n.md_preview .hljs-bullet,\n.md_preview .hljs-built_in,\n.md_preview .hljs-addition,\n.md_preview .hljs-variable,\n.md_preview .hljs-template-tag,\n.md_preview .hljs-template-variable {\n color: #d88;\n}\n.md_preview .hljs-comment,\n.md_preview .hljs-quote,\n.md_preview .hljs-deletion,\n.md_preview .hljs-meta {\n color: #777;\n}\n.md_preview .hljs-keyword,\n.md_preview .hljs-selector-tag,\n.md_preview .hljs-literal,\n.md_preview .hljs-title,\n.md_preview .hljs-section,\n.md_preview .hljs-doctag,\n.md_preview .hljs-type,\n.md_preview .hljs-name,\n.md_preview .hljs-strong {\n font-weight: bold;\n}\n.md_preview .hljs-emphasis {\n font-style: italic;\n}\n",""]);const s=i},7380:(e,n,l)=>{"use strict";l.r(n),l.d(n,{default:()=>d});var r=l(3379),i=l.n(r),s=l(9721);i()(s.Z,{insert:"head",singleton:!1});const d=s.Z.locals||{}}}]);
\ No newline at end of file
...@@ -13,49 +13,82 @@ ...@@ -13,49 +13,82 @@
body { body {
/* background-color: #222226; */ /* background-color: #222226; */
} }
.text {
width: 100%;
height: 400px;
border: 1px solid red;
overflow-y: auto;
padding: 10px;
box-sizing: border-box;
}
</style> </style>
</head> </head>
<body> <body>
<div id="app"></div> <div id="app"></div>
<!-- <textarea class="text" name="" id="" cols="30" rows="10"></textarea> -->
<div contenteditable="true" class="text"></div>
<button id="a">111111</button> <button id="a">111111</button>
<button id="b">2222222</button> <button id="b">2222222</button>
<script src="./markdown-editor.js"></script> <script src="./markdown-editor.js"></script>
<script> <script>
const ee = new MdEditor({ const ee = new MdEditor({
el: "#app", // required el: "#app", // required
value: `![pic](https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3681880960,455182084&fm=26&gp=0.jpg)\n\n value: `\`\`\`java
<a href='https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3681880960,455182084&fm=26&gp=0.jpg'>图片</a>\n\n #include "stdio.h"
<img src='https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3681880960,455182084&fm=26&gp=0.jpg' />\n\n void main()
<a href='https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3681880960,455182084&fm=26&gp=0.jpg'>图片</a>\n\n {
<img src='https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3681880960,455182084&fm=26&gp=0.jpg' />\n\n /*
<a href='https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3681880960,455182084&fm=26&gp=0.jpg'>图片</a>\n\n 完数:所有的因子相加等于这个数本身
<img src='https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3681880960,455182084&fm=26&gp=0.jpg' />\n\n 6=1+2+3
<a href='https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3681880960,455182084&fm=26&gp=0.jpg'>图片</a>\n\n */
<img src='https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3681880960,455182084&fm=26&gp=0.jpg' />\n\n int i,j,a,b,c;
<img src='https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3681880960,455182084&fm=26&gp=0.jpg' />\n\n printf("1000以内的完数如下:\n");
<a href='https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3681880960,455182084&fm=26&gp=0.jpg'>图片</a>\n\n for(i=6;i<=1000;i++)
<img src='https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3681880960,455182084&fm=26&gp=0.jpg' />\n\n {
<a href='https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3681880960,455182084&fm=26&gp=0.jpg'>图片</a>\n\n a=0;
<img src='https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3681880960,455182084&fm=26&gp=0.jpg' />\n\n //求i对应的所有的因子
<img src='https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3681880960,455182084&fm=26&gp=0.jpg' />\n\n for(j=2;j<=i;j++)
<a href='https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3681880960,455182084&fm=26&gp=0.jpg'>图片</a>\n\n {
<img src='https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3681880960,455182084&fm=26&gp=0.jpg' />\n\n if(i%j==0)
<a href='https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3681880960,455182084&fm=26&gp=0.jpg'>图片</a>\n\n {
<img src='https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3681880960,455182084&fm=26&gp=0.jpg' />\n\n a+=i/j;{1}
<img src='https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3681880960,455182084&fm=26&gp=0.jpg' />\n\n }
<a href='https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3681880960,455182084&fm=26&gp=0.jpg'>图片</a>\n\n }
<img src='https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3681880960,455182084&fm=26&gp=0.jpg' />\n\n if(i==a){
<a href='https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3681880960,455182084&fm=26&gp=0.jpg'>图片</a>\n\n //该循环语句的作用就是打印结果
<img src='https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3681880960,455182084&fm=26&gp=0.jpg' />\n\n for(j=2;j<=i;j++)
{
if(i%j==0)
{
if(i==j){
printf("%d",i/j);
}else{
printf("%d+",i/j);
}
}
}
printf("=%d\n",i);
}
}
}
\`\`\`
`, `,
value: "", // value: `
// themeOptions: { // ![pic](https://img2.baidu.com/it/u=3681880960,455182084&fm=26&fmt=auto&gp=0.jpg=40x40)
// dark: false, // `,
// borderColor: "green", // value: `
// borderColorActive: "#409eff", // const aaa = $(".left .title").hover(function() {
// textColor: "#303030", // aaa.remove()
// textColorActive: "#000" // })
// }, // `,
// value: "",
themeOptions: {
dark: false,
borderColorActive: "#409eff",
textColor: "#303030",
textColorActive: "#000",
codeTheme: "atom-one-dark"
},
toolsOptions: { toolsOptions: {
bold: true, bold: true,
italic: true, italic: true,
...@@ -70,14 +103,16 @@ ...@@ -70,14 +103,16 @@
fullScreen: true fullScreen: true
}, },
zIndex: 7000, zIndex: 7000,
maxLength: 1000, // maxLength: 1000,
showWordLimit: true, showWordLimit: true,
rows: "10", rows: "10",
// height: "600",
filePathRule: /^https:\/\/ss2\.bdstatic\.com/, filePathRule: /^https:\/\/ss2\.bdstatic\.com/,
canPreview: true, canPreview: true,
// canAttachFile: true, // canAttachFile: true,
placeholder: "请输入内容", placeholder: "请输入内容",
throttle: 1000, // throttle: 1000,
// onFocus: function(res) { // onFocus: function(res) {
// console.log(res); // console.log(res);
// }, // },
...@@ -88,10 +123,10 @@ ...@@ -88,10 +123,10 @@
console.log(res); console.log(res);
}, },
onInput: function(res) { onInput: function(res) {
console.log("input", res); // console.log("input", res);
}, },
onChange: function(res) { onChange: function(res) {
console.log("change", res); // console.log("change", res);
}, },
onSubmit: function(res) { onSubmit: function(res) {
console.log(res); console.log(res);
......
此差异已折叠。
文件已添加
{ {
"name": "markdown-editor", "name": "markdown-editor",
"description": " A open source markdown editor of csdn codechina team contributed", "description": " A open source markdown editor of csdn codechina team contributed",
"version": "0.5.2", "version": "0.5.3",
"publisher": "guoweijia", "publisher": "guoweijia",
"scripts": { "scripts": {
"start": "webpack serve --mode=development", "start": "webpack serve --mode=development",
......
...@@ -54,7 +54,7 @@ ...@@ -54,7 +54,7 @@
:ref="'md_textarea' + id" :ref="'md_textarea' + id"
@tab="$refs['md_header' + id].tab()" @tab="$refs['md_header' + id].tab()"
@submit="submit" @submit="submit"
@enter="$refs['md_header' + id].resetUlNum()" @enter="handleEnter"
@getFilteredTags="filteredTags = $event" @getFilteredTags="filteredTags = $event"
v-else v-else
/> />
...@@ -173,6 +173,9 @@ export default { ...@@ -173,6 +173,9 @@ export default {
textareaId() { textareaId() {
return "textarea_" + this.id; return "textarea_" + this.id;
}, },
headId() {
return "md_header" + this.id;
},
textareaHeight() { textareaHeight() {
const height = this.height; const height = this.height;
if (!height) return 0; if (!height) return 0;
...@@ -306,6 +309,9 @@ export default { ...@@ -306,6 +309,9 @@ export default {
} }
}, },
methods: { methods: {
handleEnter() {
this.$refs[this.headId].resetUlNum();
},
upload(e) { upload(e) {
this.fileList = Array.from(e.target.files); this.fileList = Array.from(e.target.files);
}, },
......
...@@ -175,7 +175,7 @@ export default { ...@@ -175,7 +175,7 @@ export default {
virtualDom.innerHTML = html; virtualDom.innerHTML = html;
virtualDom.querySelectorAll("code").forEach(item => { virtualDom.querySelectorAll("code").forEach(item => {
if (!/language-/.test(item.className)) { if (!/language-/.test(item.className)) {
item.className = "language-html"; item.className = "language-javascript";
} }
}); });
const DOMPurify = require("dompurify"); const DOMPurify = require("dompurify");
...@@ -227,7 +227,7 @@ export default { ...@@ -227,7 +227,7 @@ export default {
? `${contentHeight + parseFloat(fontSize) * 1.2}px` ? `${contentHeight + parseFloat(fontSize) * 1.2}px`
: "auto"; : "auto";
this.editorOverFlow = this.editorOverFlow =
this.autoSize && !this.fullScreen ? "hidden" : "auto"; this.autoSize && !this.fullScreen && !this.height ? "hidden" : "auto";
textEl.parentNode.removeChild(hideEl); textEl.parentNode.removeChild(hideEl);
}, },
submit() { submit() {
......
...@@ -217,6 +217,8 @@ export default { ...@@ -217,6 +217,8 @@ export default {
this.ulNum = 1; this.ulNum = 1;
}, },
tab() { tab() {
const textEl = document.getElementById(this.id);
const scrollTop = textEl.scrollTop;
let startStr = ""; let startStr = "";
const tabSize = parseInt(this.tabSize); const tabSize = parseInt(this.tabSize);
Array.from({ length: tabSize }).forEach(() => { Array.from({ length: tabSize }).forEach(() => {
...@@ -231,7 +233,7 @@ export default { ...@@ -231,7 +233,7 @@ export default {
}; };
const newText = formatText(originalText, selectionInfo, startStr, endStr); const newText = formatText(originalText, selectionInfo, startStr, endStr);
const len = newText.length - originalText.length; const len = newText.length - originalText.length;
this.updateText(newText, len); this.updateText(newText, len, scrollTop);
}, },
setShowPreview(val) { setShowPreview(val) {
this.$emit("update:showPreview", val); this.$emit("update:showPreview", val);
...@@ -253,8 +255,8 @@ export default { ...@@ -253,8 +255,8 @@ export default {
}); });
setTimeout(() => { setTimeout(() => {
textEl.focus(); textEl.focus();
textEl.scrollTop = scrollTop;
textEl.setSelectionRange(cursorPoint + len, cursorPoint + len); textEl.setSelectionRange(cursorPoint + len, cursorPoint + len);
textEl.scrollTop = scrollTop;
}, 0); }, 0);
} }
} }
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册