vue-quill-editor富文本渲染完成自动获取焦点,问题在于数据请求完成,富文本内容发生变化从而自动获取焦点

mounted() {
this.$refs.myQuillEditor.quill.enable(false);
this.hintGetFun();
},
methods: {
onEditorChange({ quill, html, text }) {
this.formHint.hintList[this.hintIndex].hintValue = html;
},
async hintGetFun() {
try {
let res = await hintGet(this.$route.params.pk);
if (res.data.code == "S00000") {
this.formHint.hintList = res.data.data;
//富文本编辑器神坑处理
this.$nextTick(function() {
this.$refs.myQuillEditor.quill.enable(true);
this.$refs.myQuillEditor.quill.blur();
});
}
} catch (err) {
console.log(err);
}
}

数据请求完成执行$nextTick这样就可以完美解决富文本自动获取焦点问题。

vue-quill-editor富文本焦点问题的更多相关文章

  1. Vue基于vue-quill-editor富文本编辑器使用心得

    vue-quill-editor的guthub地址,现在市面上有很多的富文本编辑器,我个人还是非常推荐Vue自己家的vue-quill-deitor,虽然说只支持IE10+,但这种问题,帅给别人吧! ...

  2. vue集成ckeditor富文本框,怎么获取CKEditor实例?

    CKEDITOR 版本5 ,vue集成形式 vue集成ckeditor富文本框,由于不是通过js创建的富文本对象,所以,无法取得实例对象,官方说明 官方在builds-->Getting and ...

  3. vue quill editor输入文字出现首字母的问题

    当使用vue quill editor输入中文时,第一个中文的汉语拼音第一个字母会显示如图. 解决的办法就是升级vue quill editor js文件的版本,目前的我升级之后ok的版本是 < ...

  4. vue集成百度富文本编辑器

    1.前期工作,访问百度富文本官网下载相应的百度富文本文件,根据后端用的技术下载相应的版本,建议下载最新版UTF-8版 (有图有真相,看图) https://ueditor.baidu.com/webs ...

  5. Vue集成tinymce富文本编辑器并实现本地化指南(2019.11.21最新)

     tinymce是一款综合口碑特别好.功能异常强大的富文本编辑器,在某些网站,甚至享有"宇宙最强富文本编辑器"的称号.那么,在Vue项目中如何集成呢?这并不困难,只需要参照官方教程 ...

  6. 关于百度Editor富文本编辑器 自定义上传位置

    因为要在网站上编辑富文本数据,所以直接采用百度的富文本编辑器,但是这个编辑器有个缺点,默认情况下,文件只能上传到网站的根目录,不能自定义路径. 而且json配置文件只能和controller.jsp在 ...

  7. vue 集成百度富文本编辑器

    <template> <div> <textarea style="display:none" id="editor_content&quo ...

  8. vue 集成 NEditor 富文本

    下载NEditor 放在  vue 项目下面 public  文件中. 安装    vue-neditor-wrap  执行命令 npm  install  vue-neditor-wrap 代码使用 ...

  9. BRAFT EDITOR富文本编辑器

    https://braft.margox.cn/demos/basic     官方文档 import React from 'react' import Uploading from '../Upl ...

随机推荐

  1. Mycat(5):聊天消息表数据库按月分表实践,平滑扩展

    本文的原文连接是: http://blog.csdn.net/freewebsys/article/details/47003577 未经博主同意不得转载. 1,业务需求 比方一个社交软件,比方像腾讯 ...

  2. LINQ实现

    public static IEnumerable<TSource> MyWhere<TSource>(     this IEnumerable<TSource> ...

  3. ASP.NET MVC Model之二模型绑定

    Asp.net mvc中的模型绑定,或许大家经常用,但是具体说他是怎么一回事,可能还是会有些陌生,那么,本文就带你理解模型绑定.为了理解模型绑定,本文会先给出其定义,然后对通过比,来得出使用模型绑定的 ...

  4. Android学习笔记(14):相对布局RelativeLayout

    相对布局RelativeLayout,继承自ViewGroup.相对布局的子组件的位置总是相对于兄弟组件或者父容器决定的. RelativeLayout支持的XML属性: android:gravit ...

  5. 【bzoj3288】Mato矩阵

    题目大意:给定一个n阶行列式,第i行第j列为GCD(i,j),求这个行列式的值 高斯消元之后发现对角线上的东西是phi 于是线性筛出所有的欧拉函数即可 #include<algorithm> ...

  6. ubuntu将mysql、nginx添加到环境变量中

    vim /etc/profile 添加 export PATH="$PATH:/usr/local/mysql/bin" export PATH="$PATH:/usr/ ...

  7. Notification操作大全

    目录 一:普通的Notification Notification 的基本操作 给 Notification 设置 Action 更新 Notification 取消 Notification 设置 ...

  8. MSD3458开发资料

    MSD3458HB是mstar最新推出的普通4K数字电视解决方案,不带操作系统,是一个低成本的4K方案,156脚的LQFP普通封装,开发难度低,支持HDMI2.0输入,支持4K输出.1. Suppor ...

  9. bzoj3270

    3270: 博物馆 Time Limit: 30 Sec  Memory Limit: 128 MBSubmit: 474  Solved: 261[Submit][Status][Discuss] ...

  10. mldonkey设置!看图(转载)

    转自:http://www.nenew.net/ubuntu-mldonkey-application.html 这里不是争论区,amule和mldonkey各有各好,看个人爱好,没有高下,都是程序员 ...