(react)输入框输入sql语句关键字变色

新手上路,请多包涵

image.png
输入框关键字输入实时变色

阅读 5.2k
2 个回答

我觉得可以这么操作就是,你先定义一个字符串按空格分隔 列出所有的关键字,在onChange的时候,用正则判断有没有,有的话替换成加span 有样式标签的html字符

你需要的是一个 SQL 语法高亮的编辑器
不过像 codepenjsbinvscode这些编辑器都太重了,并且可能需要自己实现 SQL 的插件,所以我用关键词 SQL highlight 帮你在 GitHub 搜索并用javascript 筛选了一下,搜索结果 还是蛮多的。
scriptcoded/sql-highlight 似乎就很切题,按照它的示例代码处理 SQL 语句,然后用 dangerouslySetInnerHTML 插入到 react 组件里;或者使用 pveyes/htmr 转成 react 组件。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题