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. 【bzoj1406】[AHOI2007]密码箱

    x2 ≡ 1 mod n => x2 = k * n + 1 => n | (x + 1) * (x - 1) 令n = a * b,则 (a | x + 1 且 b | x - 1) 或 ...

  2. beego2---入门

    package main //beego既可以建立web应用也可以建立api应用 //beego是一个gohttp服务器的高层封装, import ( _ "beego1/routers&q ...

  3. Python: PS 滤镜--万花筒效果

    本文用 Python 实现 PS 的一种滤镜效果,称为万花筒.也是对图像做各种扭曲变换,最后图像呈现的效果就像从万花筒中看到的一样: 图像的效果可以参考之前的博客: http://blog.csdn. ...

  4. 16. Ext.ux.TabCloseMenu插件的使用(TabPanel右键关闭菜单) 示例

    转自:https://crabdave.iteye.com/blog/327978 Ext.ux.TabCloseMenu插件的使用(TabPanel右键关闭菜单) 示例 效果: 创建调用的HTML: ...

  5. springcloud 向Eureka中注册服务异常java.net.ConnectException: Connection refused: connect

    异常如下: 通过debug发现,服务端的url地址仍然是默认的http://localhost:8761/eureka/apps/,也就是说yml文件中配置没有生效,检查后发现yml中相关配置多写了一 ...

  6. Netty,Thrifty

    小白科普:Netty有什么用? https://mp.weixin.qq.com/s/PTKnRQ_hLf8BBPYnywLenA Thrifty 是基于.net Attribute 实现了标准 Th ...

  7. source命令用法(转载)

    转自:http://zhidao.baidu.com/link?url=mNfsPHSjTEm7llgyMYx0UVNwkJmD_cxLeHtZnHcM6Ms8LDXofVHka_EzHi6GltbR ...

  8. Avito Code Challenge 2018 A~E

    A. Antipalindrome 还以为是什么神dp结果就是分情况讨论啊 原串是一串一样的字符的话输出0,是回文串的话输出n-1,否则直接输出原串长度 #include<iostream> ...

  9. 10.11NOIP模拟题(3)

    /* 可以看出,对于一段区间[L,R]如果统计了答案 若a[L]<a[R],那么当右端点往左移时答案不会更优,a[R]>a[L]同理 所以两个指针分别从头尾往中间扫那边小移哪边即可. */ ...

  10. 10.11NOIP模拟题(2)

    /* string水过 */ #include<bits/stdc++.h> #define N 1001 using namespace std; int n,x,y,m,pre; st ...