一、placeholder默认样式修改
.ql-editor.ql-blank::before {
//placeholder默认样式修改
}
二、踩过的editor的坑及部分解决办法:
1、editor 无法添加获取、设定光标位置功能;
解决方案:可以通过EditorContext.insertText做一个占位符,使用editorContext.setContents()再重新拼好html插入,但是setContents api插入后光标会返回输入框首位【官方bug】。
2、editor无法获取keyCode,类似于监听@字符选择用户的编辑、删除不太好做。
解决方案:开发监听输入@的事件,可通过新老的html字符串做diff算法,过滤出是否有@字符再去处理后续事宜。缺点是比较耗费性能。
3、部分标签不支持class和id属性,在插入时加上这些属性也会被干掉。
解决方案:通过最后的正则匹配去加这些需要的属性。
4、目前小程序富文本仅支持图片和文字的编辑,若有视频和音频的需求甚用。
5、editor多次重复编辑时,editor会在img标签上多次增加RichText--${extClass}
这个类名,导致html文本长度意外变长;
解决方案:通过最后的正则匹配去除不必要的重复类名。
6、input/textarea和editor在同一个页面,input/textarea的聚焦会引起editor的聚焦事件,所以键盘高度和页面的高度处理需要着重思考。
解决方案:利用editor的只读属性read-only,input/textarea聚焦时设置editor为只读,失焦时设置editor恢复可编辑状态。