react-codemirror2 编辑器需点击一下或者延时才显示数据的问题

现象:

        <Codemirror/>组件的数据已经赋上值的情况下,初始状态不渲染数据,需要点击编辑框获取焦点后才展示,或者延迟了几秒才显示出来。

原因:

        指定了一些依赖的版本,可能不兼容了一些功能,导致这个现象出现

解决:

        1. 手动引入自动刷新的插件 ;

        2. 配置一下参数 

代码如下:

import {UnControlled as CodeMirror} from 'react-codemirror2';
import 'codemirror/lib/codemirror.css';
import 'codemirror/mode/sql/sql'; 
...
// 引入自动刷新
import 'codemirror/addon/display/autorefresh'<CodeMirror value={format(code,{lanuage:'plsql'})} options={autoRefresh: true, // 重点是这句,为truescrollbarStyle: null,mode: 'text/x-pgsql',theme: 'material',autofocus: false,readOnly: false,lineNumbers: true, smartIndent: true,lint: true,lintWrapping: true} onChange={(editor,data,value)=>{...}}
>
</CodeMirror>

官网:https://github.com/uiwjs/react-codemirror

codemirror2编辑器总结

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/40844.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

C# int ? 关键字使用方法

使用C#的时间也不算短。 但是今天看到了一个从来没有见过的写法 Int &#xff1f;这是个什么写法&#xff0c;没见过啊&#xff0c;百度了查一下&#xff0c;也在这里记录一下。 1、int? 关键字说明 (1)、int? 表示一个int类型,且该int类型可空,如果不加?的话,那么int类…

C语言刷题指南(一)

&#x1f4d9;作者简介&#xff1a; 清水加冰&#xff0c;目前大二在读&#xff0c;正在学习C/C、Python、操作系统、数据库等。 &#x1f4d8;相关专栏&#xff1a;C语言初阶、C语言进阶、数据结构刷题训练营、有感兴趣的可以看一看。 欢迎点赞 &#x1f44d; 收藏 ⭐留言 &am…

认识excel篇3之数据的有效性(数据验证)

数据有效性不仅能够对单元格的输入数据进行条件限制&#xff0c;还可以在单元格中创建下拉列表菜单方便用户选择输入。如果没有做数据验证&#xff0c;单元格内默认可以输入任意类型的数据。数据验证就是限制单元格输入数据&#xff08;必须输入符合要求的才能输入&#xff09;…

VS2022如何查看类成员都在哪里被调用了(VS如何打开Call Hierarchy视图)

文章目录 打开Call Hierarchy视图查看成员的调用 打开Call Hierarchy视图 单击菜单栏的“视图” > “调用层次结构”&#xff0c;即可打卡Call Hierarchy视图。 查看成员的调用 在代码编辑窗口&#xff0c;右键单击想要查看的类成员&#xff0c;然后选择“查看调用层次结…

机器学习算法之-逻辑回归(2)

为什么需要逻辑回归 拟合效果太好 特征与标签之间的线性关系极强的数据&#xff0c;比如金融领域中的 信用卡欺诈&#xff0c;评分卡制作&#xff0c;电商中的营销预测等等相关的数据&#xff0c;都是逻辑回归的强项。虽然现在有了梯度提升树GDBT&#xff0c;比逻辑回归效果更…

一、数学建模之线性规划篇

1.定义 2.例题 3.使用软件及解题 一、定义 1.线性规划&#xff08;Linear Programming&#xff0c;简称LP&#xff09;是一种数学优化技术&#xff0c;线性规划作为运筹学的一个重要分支&#xff0c;专门研究在给定一组线性约束条件下&#xff0c;如何找到一个最优的决策&…

JavaScript请求数据的4种方法总结(Ajax、fetch、jQuery、axios)

JavaScript请求数据有4种主流方式&#xff0c;分别是Ajax、fetch、jQuery和axios。 一、Ajax、fetch、jQuery和axios的详细解释&#xff1a; 1、 Ajax Ajax&#xff08;Asynchronous JavaScript and XML&#xff09;是一种使用JavaScript在用户的浏览器上发送请求的技术&…

springboot综合案例第三课

SpringSecurity入门 什么是SpringSecurity Spring Security 的前身是 Acegi Security &#xff0c;是 Spring 项目组中用来提供安全认证服务的框架。 (https://projects.spring.io/spring-security/) Spring Security 为基于J2EE企业应用软件提供了全面安全服务。特别 是使…

环形队列+DMA空闲中断+接收串口数据

环形队列DMA空闲中断接收串口数据 一.序言二.实验原理三.实战是检验真理的唯一标准3.1 usart1.c3.2 串口中断 三.队列代码4.1 fifo.c4.2 fifo.h 五.结语 一.序言 本次实验利用环形队列DMA空闲中断串口。。通过这个实验可以非常深入的理解队列&#xff0c;DMA,串口的知识。如果…

使用低版本vcpkg时,bootstrap-vcpkg.bat无法生成vcpkg.exe的可能原因

缘由 需要使用vcpkg中低版本的第三方库&#xff0c;下载vcpkg后&#xff0c;回退至指定版本&#xff0c;运行bootstrap-vcpkg.bat生成vcpkg.exe时&#xff0c;命令行窗口总是一闪而过&#xff0c;但是vcpkg.exe却没有生成。 添加pause&#xff0c;查看错误 编辑bootstrap-vc…

docker的网络模式

docker0网络 docker容器的 虚拟网关loopback &#xff1a;回环网卡、TCP/IP网卡是否生效virtual bridge&#xff1a;linux 自身继承了一个虚拟化功能&#xff08;kvm架构&#xff09;&#xff0c;是原生架构的一个虚拟化平台&#xff0c;安装了一个虚拟化平台之后就会系统就会自…

ftp设置空闲连接超时时间和数据连接超时时间

在FTP协议中&#xff0c;可以通过配置服务器端的空闲连接超时时间来设置连接的过期时间。具体步骤如下&#xff1a; 登录FTP服务器&#xff0c;进入服务器的配置文件目录。通常配置文件位于/etc或/etc/vsftpd目录下。打开FTP服务器的配置文件&#xff0c;例如vsftpd.conf。在配…

区间预测 | MATLAB实现QRBiLSTM双向长短期记忆神经网络分位数回归时间序列区间预测

区间预测 | MATLAB实现QRBiLSTM双向长短期记忆神经网络分位数回归时间序列区间预测 目录 区间预测 | MATLAB实现QRBiLSTM双向长短期记忆神经网络分位数回归时间序列区间预测效果一览基本介绍模型描述程序设计参考资料 效果一览 基本介绍 区间预测 | MATLAB实现QRBiLSTM双向长短…

Codeforces 461B 树形 DP

题意 传送门 Codeforces 461B Appleman and Tree 题解 d p v , k dp_{v,k} dpv,k​ 代表以节点 v v v 为根的子树中&#xff0c;包含了 v v v 的联通分量是否存在一个黑色节点 &#xff0c;同时其余联通分量仅包含一个黑色节点情况下&#xff0c;划分方案的数量。DFS 求解&…

微服务观测性提升专项梳理

文章目录 项目背景&#xff1a;项目目标&#xff1a;专项人员关键问题及风险APM 进展 项目背景&#xff1a; 随着微服务架构的普及&#xff0c;构建和管理大规模的分布式系统变得越来越复杂。为了确保这些系统的可靠性和性能&#xff0c;以及快速排除故障&#xff0c;对微服务…

Git 合并分支时允许合并不相关的历史

git fetch git fetch 是 Git 的一个命令&#xff0c;用于从远程仓库中获取最新的提交和数据&#xff0c;同时更新本地仓库的远程分支指针。 使用 git fetch 命令可以获取远程仓库的最新提交&#xff0c;但并不会自动合并或修改本地分支。它会将远程仓库的提交和引用&#xff…

Linux如何查看文件进程占用-lsof

lsof命令是什么&#xff1f; 可以列出被进程所打开的文件的信息。被打开的文件可以是 1.普通的文件&#xff0c;2.目录 3.网络文件系统的文件&#xff0c;4.字符设备文件 5.(函数)共享库 6.管道&#xff0c;命名管道 7.符号链接 8.底层的socket字流&#xff0c;网络socket…

Rust语法: 枚举,泛型,trait

这是我学习Rust的笔记&#xff0c;本文适合于有一定高级语言基础的开发者看不适合刚入门编程的人&#xff0c;对于一些概念像枚举&#xff0c;泛型等&#xff0c;不会再做解释&#xff0c;只写在Rust中怎么用。 文章目录 枚举枚举的定义与赋值枚举绑定方法和函数match匹配枚举…

代码随想录算法训练营二刷第一天| 704. 二分查找,27. 移除元素

代码随想录算法训练营二刷第一天| 704. 二分查找&#xff0c;27. 移除元素 文章目录 代码随想录算法训练营二刷第一天| 704. 二分查找&#xff0c;27. 移除元素一、704. 二分查找二、35.搜索插入位置三、34. 在排序数组中查找元素的第一个和最后一个位置四、69.x 的平方根五、3…