MigrateRepos/vue-markdown
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

修复选中文字后点击工具栏上的按钮后导致光标定位不准确的bug

Browse Source 
Signed-off-by: huzhi1351 <huzhi1351@163.com>
This commit is contained in:
huzhi1351 2020-01-12 17:03:40 +08:00
parent 7e84df37bd
commit e196e2d403
1 changed files with 23 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

67
src/components/simple/simple.js
View File

@ -1,4 +1,4 @@
import marked from '../../config/marked'; import marked from '../../config/marked';
import common from '../../mixins/common'; import common from '../../mixins/common';
export default { export default {
@ -43,9 +43,9 @@ export default {
}) })
}, 20); }, 20);
}, },
insertContent(initStr) { insertContent(initStr) {
// 插入文本 // 插入文本
let cursorSwitch = 0; // 0: 默认值, 适配原逻辑; 1: 增加了换行符;
this.lastInsert = initStr; this.lastInsert = initStr;
const point = this.getCursortPosition(); const point = this.getCursortPosition();
const lastChart = this.currentValue.substring(point - 1, point); const lastChart = this.currentValue.substring(point - 1, point);
@ -59,10 +59,12 @@ export default {
lastFourCharts !== ' ' lastFourCharts !== ' '
) { ) {
const str = '\n' + initStr; const str = '\n' + initStr;
cursorSwitch = 1;
this.insertAfterText(str); this.insertAfterText(str);
} else { } else {
this.insertAfterText(initStr); this.insertAfterText(initStr);
} }
return cursorSwitch;
}, },
getCursortPosition() { getCursortPosition() {
// 获取光标位置 // 获取光标位置
@ -125,6 +127,13 @@ export default {
range.select(); range.select();
} }
}, },
setCaretBySwitch(cursorSwitch, point, offset) {
if (cursorSwitch === 1) {
this.setCaretPosition(point + offset + 1);
} else if (!cursorSwitch) {
this.setCaretPosition(point + offset);
}
},
insertQuote() { insertQuote() {
// 引用 // 引用
this.insertContent('\n> '); this.insertContent('\n> ');
@ -148,68 +157,38 @@ export default {
insertCode() { insertCode() {
// 插入code // 插入code
const point = this.getCursortPosition(); const point = this.getCursortPosition();
const lastChart = this.currentValue.substring(point - 1, point); const cursorSwitch = this.insertContent('\n```\n\n```');
this.insertContent('\n```\n\n```'); this.setCaretBySwitch(cursorSwitch, point, 5);
if (lastChart !== '\n' && this.currentValue !== '') {
this.setCaretPosition(point + 5);
} else {
this.setCaretPosition(point + 5);
}
}, },
insertStrong() { insertStrong() {
// 粗体 // 粗体
const point = this.getCursortPosition(); const point = this.getCursortPosition();
const lastChart = this.currentValue.substring(point - 1, point); const cursorSwitch = this.insertContent('****');
this.insertContent('****'); this.setCaretBySwitch(cursorSwitch, point, 2);
if (lastChart !== '\n' && this.currentValue !== '') {
this.setCaretPosition(point + 2);
} else {
this.setCaretPosition(point + 2);
}
}, },
insertItalic() { insertItalic() {
// 斜体 // 斜体
const point = this.getCursortPosition(); const point = this.getCursortPosition();
const lastChart = this.currentValue.substring(point - 1, point); const cursorSwitch = this.insertContent('**');
this.insertContent('**'); this.setCaretBySwitch(cursorSwitch, point, 1);
if (lastChart !== '\n' && this.currentValue !== '') {
this.setCaretPosition(point + 1);
} else {
this.setCaretPosition(point + 1);
}
}, },
insertBg() { insertBg() {
// 背景色 // 背景色
const point = this.getCursortPosition(); const point = this.getCursortPosition();
const lastChart = this.currentValue.substring(point - 1, point); const cursorSwitch = this.insertContent('====');
this.insertContent('===='); this.setCaretBySwitch(cursorSwitch, point, 5);
if (lastChart !== '\n' && this.currentValue !== '') {
this.setCaretPosition(point + 5);
} else {
this.setCaretPosition(point + 5);
}
}, },
insertUnderline() { insertUnderline() {
// 下划线 // 下划线
const point = this.getCursortPosition(); const point = this.getCursortPosition();
const lastChart = this.currentValue.substring(point - 1, point); const cursorSwitch = this.insertContent('<u></u>');
this.insertContent('<u></u>'); this.setCaretBySwitch(cursorSwitch, point, 3);
if (lastChart !== '\n' && this.currentValue !== '') {
this.setCaretPosition(point + 3);
} else {
this.setCaretPosition(point + 5);
}
}, },
insertOverline() { insertOverline() {
// overline // overline
const point = this.getCursortPosition(); const point = this.getCursortPosition();
const lastChart = this.currentValue.substring(point - 1, point); const cursorSwitch = this.insertContent('~~~~');
this.insertContent('~~~~'); this.setCaretBySwitch(cursorSwitch, point, 2);
if (lastChart !== '\n' && this.currentValue !== '') {
this.setCaretPosition(point + 2);
} else {
this.setCaretPosition(point + 2);
}
}, },
insertTitle(level) { insertTitle(level) {
// 插入标题 // 插入标题