vue-quill-editor富文本焦点问题
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富文本焦点问题的更多相关文章
- Vue基于vue-quill-editor富文本编辑器使用心得
vue-quill-editor的guthub地址,现在市面上有很多的富文本编辑器,我个人还是非常推荐Vue自己家的vue-quill-deitor,虽然说只支持IE10+,但这种问题,帅给别人吧! ...
- vue集成ckeditor富文本框,怎么获取CKEditor实例?
CKEDITOR 版本5 ,vue集成形式 vue集成ckeditor富文本框,由于不是通过js创建的富文本对象,所以,无法取得实例对象,官方说明 官方在builds-->Getting and ...
- vue quill editor输入文字出现首字母的问题
当使用vue quill editor输入中文时,第一个中文的汉语拼音第一个字母会显示如图. 解决的办法就是升级vue quill editor js文件的版本,目前的我升级之后ok的版本是 < ...
- vue集成百度富文本编辑器
1.前期工作,访问百度富文本官网下载相应的百度富文本文件,根据后端用的技术下载相应的版本,建议下载最新版UTF-8版 (有图有真相,看图) https://ueditor.baidu.com/webs ...
- Vue集成tinymce富文本编辑器并实现本地化指南(2019.11.21最新)
tinymce是一款综合口碑特别好.功能异常强大的富文本编辑器,在某些网站,甚至享有"宇宙最强富文本编辑器"的称号.那么,在Vue项目中如何集成呢?这并不困难,只需要参照官方教程 ...
- 关于百度Editor富文本编辑器 自定义上传位置
因为要在网站上编辑富文本数据,所以直接采用百度的富文本编辑器,但是这个编辑器有个缺点,默认情况下,文件只能上传到网站的根目录,不能自定义路径. 而且json配置文件只能和controller.jsp在 ...
- vue 集成百度富文本编辑器
<template> <div> <textarea style="display:none" id="editor_content&quo ...
- vue 集成 NEditor 富文本
下载NEditor 放在 vue 项目下面 public 文件中. 安装 vue-neditor-wrap 执行命令 npm install vue-neditor-wrap 代码使用 ...
- BRAFT EDITOR富文本编辑器
https://braft.margox.cn/demos/basic 官方文档 import React from 'react' import Uploading from '../Upl ...
随机推荐
- 玩转单元測试之WireMock -- Web服务模拟器
WireMock 是一个灵活的库用于 Web 服务測试,和其它測试工具不同的是.WireMock 创建一个实际的 HTTPserver来执行你的 Web 服务以方便測试. 它支持 HTTP 响应存根. ...
- 获取Linux磁盘分区的UUID
在设置fstab自动挂载时,需要填写如下的信息: # <file system> <mount point> <type> <options> < ...
- [RK3288][Android6.0] 音频调试方法小结【转】
本文转载自:http://blog.csdn.net/kris_fei/article/details/70053135 Platform: ROCKCHIPOS: Android 6.0Kernel ...
- html5 弹性布局
html5 弹性布局 一.移动开发常用技巧 Viewport基本知识 设置布局Viewport的各种信息1.width=device-width: 设置Viewport视口宽度等于设备宽度2.init ...
- BZOJ_1150_[CTSC2007]数据备份Backup_堆+贪心
BZOJ_1150_[CTSC2007]数据备份Backup_堆+贪心 Description 你在一家 IT 公司为大型写字楼或办公楼(offices)的计算机数据做备份.然而数据备份的工作是枯燥乏 ...
- [Codeforces Education Round 6E] New Year Tree
[题目链接] https://codeforces.com/contest/620/problem/E [算法] 显然 , 一棵子树的DFS序必然为连续的一段 用线段树维护颜色数即可 [代码] #in ...
- cubism.js
Cubism.js 是时间序列化的一个D3插件,使用Cubism构建更好的实时指示板,从Graphite,Cube 和其他的资源中拉拉取数据.在GitHub的Apache License上可以获取Cu ...
- Python 之reduce()函数
reduce()函数: reduce()函数也是Python内置的一个高阶函数.reduce()函数接收的参数和 map()类似,一个函数 f,一个list,但行为和 map()不同,reduce() ...
- bzoj 1679: [Usaco2005 Jan]Moo Volume 牛的呼声【枚举】
直接枚举两两牛之间的距离即可 #include<iostream> #include<cstdio> #include<algorithm> using names ...
- hdu1512 Monkey King(并查集,左偏堆)
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1512 题目大意:有n个猴子,一开始每个猴子只认识自己.每个猴子有一个力量值,力量值越大表示这个猴子打架 ...