富文本编辑器聚焦问题
程序员文章站
2023-01-31 13:49:15
在我们对富文本编辑器赋值时,默认会有一次聚焦。聚焦会导致组件在使用时,改变页面本身滚动高度位置。这往往不是我们想要看到的。亲测有用的解决方案:// 获取编辑器 domprivate get editor() { return (this.$refs.textEditor as any).quill;}private async mounted() { // 若需要赋默认值: value 为请求到的相应值, content 为编辑器 model值 if (this.value) {...
在我们对富文本编辑器赋值时,默认会有一次聚焦。
聚焦会导致组件在使用时,改变页面本身滚动高度位置。这往往不是我们想要看到的。
亲测有用的解决方案:
// 获取编辑器
private get editor() {
return (this.$refs.textEditor as any).quill;
}
private async mounted() {
// 若需要赋默认值: value 为请求到的响应值, content 为编辑器 model值
if (this.value) {
this.content = this.value;
}
// 取消自动聚焦
this.editor.enable(false);
await this.$nextTick();
this.editor.enable(true);
this.editor.blur();
}
本文地址:https://blog.csdn.net/baidu_41828042/article/details/108983981
推荐阅读
-
利用contenteditable属性与execCommand()方法制作简易富文本编辑器_html/css_WEB-ITnose
-
关于文本编辑器识别中文的有关问题
-
vue引入富文本编辑器——mavonEditor
-
js基础-富文本编辑器
-
springBoot下后端百度富文本编辑器的写法
-
Javascript实现简单的富文本编辑器附演示_javascript技巧
-
javascript - 大公司是怎么做富文本编辑器过滤方案的?
-
小程序的四次元口袋:editor富文本编辑器的使用、渲染,以及rich-text进行解析
-
微信小程序富文本编辑器editor+rich-text(附源码)
-
django教你如何轻松使用富文本编辑器CKEditor