欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  移动技术

富文本编辑器聚焦问题

程序员文章站 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

相关标签: 问题总结 vue