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. SSM使用PageHelper

    第一步---->导入Maven依赖 <!--pageHelper--> <dependency> <groupId>com.github.pagehelper ...

  2. 【随笔记】全志平台 gpio-leds 驱动应用

    硬件信息 内核版本:Linux 4.9 硬件原理: GPIO 通过一颗 MOS 管(2N7002ET1G),接到 LED 负极,LED 正极接电源. GPIO 通过拉高导通 MOS ,将 LED 接地 ...

  3. java基础：方法

    方法 方法是解决一类问题的步骤的有序组合 包含于类/对象中 设计原则 方法的原子性:一个方法只实现一个功能 定义与调用 方法的组成: 方法的调用 若方法返回值为空 System.out.println ...

  4. 线上排查：内存异常使用导致full gc频繁

    线上排查:内存异常使用导致full gc频繁 问题系统 日常巡检发现,应用线上出现频繁full gc 现象 应用线上出现频繁full gc 排查过程 分析dump 拉dump文件:小插曲:dump时如 ...

  5. vue学习笔记（三）---- vue-resource

    一.使用vue-resource发起get请求 github仓库地址:https://github.com/pagekit/vue-resource/blob/develop/docs/http.md ...

  6. ASP.NET Core - IStartupFilter 与 IHostingStartup

    1. IStartupFilter   上面讲到的方式虽然能够根据不同环境将Startup中的启动逻辑进行分离,但是有些时候我们还会可以根据应用中的功能点将将一系列相关中间件的注册封装到一起,从 St ...

  7. activiti03 SSM使用activity

    1.添加依赖 <!--activity依赖--> <dependency> <groupId>org.activiti</groupId> <ar ...

  8. JSTL标签库C标签的使用注意事项

    今天在写jsp中在c标签上踩了不少坑,在此记录一下. <c:if>标签单独使用,不与<c:otherwise>配套使用,搭配使用会报错. <c:otherwise> ...

  9. uboot目录

    目录 api 与硬件无关的 API 函数. arch 与架构体系有关的代码. 各种架构,例如arm cpu  各种版本的cpu, 例如armv7, arm9 各种厂商,例如瑞芯微mach-rockch ...

  10. require.context 自动引入指定目录下的文件、组件、reducer

    1. 语法:let  webpacks = require.context (directory,useSubdirectories,regExp)  (directory:"文件路径&qu ...