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. php(cli模式)执行文件传递参数

    php -f index.php hello test 2314 shell命令执行php文件不像http那样通过GET方式传参 同样php文件获取的时候也不能用$_GET方法了 而是通过$argv[ ...

  2. Python爬虫开发【第1篇】【代理】

    1.简单的自定义opener() import urllib2 # 构建一个HTTPHandler 处理器对象,支持处理HTTP请求 http_handler = urllib2.HTTPHandle ...

  3. HNOI模拟 Day3.22

    第一题: 盾盾的打字机 (drdrd) [题目描述] 盾盾有一个非常有意思的打字机,现在盾哥要用这台打字机来打出一段文章. 由于有了上次的经验,盾盾预先准备好了一段模板 A 存在了内存中,并以此为基础 ...

  4. MongoDB全文搜索——目前尚不支持针对特定field的搜索

    > db.articles.createIndex( { subject: "text" } ) { "createdCollectionAutomatically ...

  5. luence全文检索(数据库检索)

    注解:从数据库中查询所有数据然后放入luence中,然后在luence来检索 package com.zhu.demo; import java.io.IOException; import java ...

  6. 测试DNS服务的命令

    测试DNS服务的命令 dig dig用于测试dns系统,因此不会查询hosts文件进行解析. dig - DNS lookup utility dig [@global-server] [domain ...

  7. Django day 38 结算中心,支付中心,计算价格方法

    一:结算中心 二:支付中心 三:计算价格方法

  8. python re的使用

    re 正则表达式操作  本模块提供了类似于Perl的正则表达式匹配操作.要匹配的模式和字符串可以是Unicode字符串以及8位字符串. 正则表达式使用反斜杠字符('\')来表示特殊的形式或者来允许使用 ...

  9. 乐搏讲自动化测试-python语言特点及优缺点(5)

    相信小伙伴们都知道,随着软件测试行业的发展和进步自动化测试已经成为必然.在竞争日益激烈的市场环境中也是你升职加薪的利器. 所以,小编决定从今天起!将要系统.连续.高质量的持续更新「整套自动化测试」文章 ...

  10. [C陷阱和缺陷] 第5章 库函数

      有关库函数的使用,我们能给出的最好建议是尽量使用系统头文件,当然也可以自己造轮子,随个人喜好.本章将探讨某些常用的库函数,以及编程者在使用它们的过程中可能出错之处.   5.1 返回整数的getc ...