export function numberToColor(text, color = '#635BFF', size = '12px') {

  let reg = /(\d+)/g;

  return text.replace(reg, `<span style="color: ${color};size: ${size}">$1</span>`);

}

效果：

React.js 修改文本中数字样式的更多相关文章

  1. JS修改标签中的文本且不影响其中标签

    /********************************************************************* * JS修改标签中的文本且不影响其中标签 * 说明: * ...

  2. 【百度地图API1.1】修改文本标注的样式

    原文:[百度地图API1.1]修改文本标注的样式 百度地图API1.0中文本标注的样式写法为: label.getDom().style.borderColor = "#808080&quo ...

  3. JS实现文本中查找并替换字符

    JS实现文本中查找并替换字符 效果图: 代码如下,复制即可使用: <!DOCTYPE html><html> <head> <style type=" ...

  4. js修改html中class属性

    document.getElementById("tr").setAttribute("class","styleclass"); 其中  ...

  5. react之四种组件中DOM样式设置方式

    1.行内样式 想给虚拟dom添加行内样式,需要使用表达式传入样式对象的方式来实现 行内样式需要写入一个样式对象,而这个样式对象的位置可以放在很多地方 例如:render函数里.组件原型上.外链js文件 ...

  6. js验证文本框数字

    输入框 <input name="title" type="text" oninput="onlyNum(this,'')" titl ...

  7. js修改文档的样式

    <!DOCTYPE html><html><head><meta charset="UTF-8"><title>Java ...

  8. js 修改字符串中某些字符的样式

    var str = 'abcdefghijklmnobqrstuvwxyz'; function HightLight(e){ var reg = new RegExp(e, 'g') str = s ...

  9. 在react.js上使用antd-design没有样式

    两种解决方法: 第一种: 在.babelrc中加入 { "presets": ["es2015", "react"], "plug ...

  10. config.js配置页面中的样式和图片路径

    这个文章用在什么地方,我先说一下,上周啊,我接到一个任务.因为公司业务要对接不同的银行,例如在工行下颜色是红色的,在其他银行下默认为蓝色,所以在页面一致的情况下,保证页面中的按钮和ICON是可以配置的 ...

随机推荐

  1. 【随笔记】linux usb gadget ncm wrong ndp sign 问题修复

    一.模拟网卡简介 在 Linux 通过 usb 模拟网卡时,有四种方式: 1. 使用 usb gadget rndis 2. 使用 usb gadget ecm 3. 使用 usb gadget nc ...

  2. python学习第三周总结

    文件操作 文件的读写模式 文件的操作模式 文件相关操作 文件内光标移动 文件内容修改 函数前戏 函数的语法结构 函数的定义和调用 函数的分类 函数的返回值 函数的参数 函数参数之位置参数 默认参数 可 ...

  3. springcloud12-spring cloud stream

    1.基础说明 官网:https://spring.io/projects/spring-cloud-stream#overview   文档:https://docs.spring.io/spring ...

  4. Vue视频 | 【Vue2 + Vue3 前端教程】完整版

    目前大部分公司还是以vue.react技术为主的,而Vue中还是以Vue2为主流,但不可否认Vue3是未来所必须的且已有这个趋向了 今天给大家介绍一个Vue的教程 里面既有现在主流的Vue2 同时也存 ...

  5. Sentinel熔断与限流

    1.简介 在线文档: https://sentinelguard.io/zh-cn/docs/system-adaptive-protection.html 功能: 流量控制 速率控制 熔断和限流 和 ...

  6. http协议介绍，token和session原理

    1.http协议 https://www.cnblogs.com/lauhp/p/8979393.html 1. 定义 http Hyper Text Transfer Protocol,超文本传输协 ...

  7. JZOJ 3242. Spacing

    \(\text{Analysis}\) 最大值最小很容易想到二分答案 然后用 \(dp\) 检查 设 \(f_i\) 表示当前行最后一个为 \(i\) 时最优情况最大空格数是否小于 \(mid\) 若 ...

  8. Cobalt Strike 之：域内渗透

    郑重声明: 本笔记编写目的只用于安全知识提升,并与更多人共享安全知识,切勿使用笔记中的技术进行违法活动,利用笔记中的技术造成的后果与作者本人无关.倡导维护网络安全人人有责,共同维护网络文明和谐. Co ...

  9. 分布式任务调度平台XXL-JOB安装

    安装xxl-job-admin 1.拉取镜像 #拉取镜像 docker pull xuxueli/xxl-job-admin:2.3.0 #新建挂载目录 mkdir /usr/local/xxl-jo ...

  10. Python连接hadoop-hive连接方法

    import impala.dbapi as ipdbconn = ipdb.connect(host='IP', port= 端口, database='数据库名', auth_mechanism= ...