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. 看不懂打我系列------图文并茂基于CentOS Linux release 7.8.2003 Core安装并Docker化你的Node.js应用

    @图文并茂基于CentOS Linux release 7.8.2003 Core安装并Docker化你的Node.js应用 简体中文 | English 说明 本文介绍如何在CentOS Linux ...

  2. ORM哪家强？java，c#，php，python，go 逐一对比， 网友直呼：全面客观

    前言 最近一段时间,我使用golang开发了一个新的ORM库. 为了让这个库更好用,我比较研究了各语言的主流ORM库,发现有一些语言的ORM库确实很好用,而有另外一些语言的库那不是一般的难用. 然后我 ...

  3. 【Oculus Interaction SDK】（三）限制可操作物体的移动 / 旋转

    前言 这篇文章是[Oculus Interaction SDK]系列的一部分,如果发现有对不上的对方,可以回去翻看我之前发布的文章,或在评论区留言.如果文章的内容已经不适用于新版本了,也可以直接联系我 ...

  4. 基于遗传算法的地图四色原理绘图上色的Python代码

      本文介绍利用Python语言,实现基于遗传算法(GA)的地图四色原理着色操作. 1 任务需求   首先,我们来明确一下本文所需实现的需求.   现有一个由多个小图斑组成的矢量图层,如下图所示.   ...

  5. 822. 走方格(acwing)

    题目: 先讲变量 n:右下角的x值 m:右下角的y值 ans:答案(有几种可能) a数组:用来存储向下和向右的动作. x:所在的位置的x值 y:所在位置的y值 x1:下一步可以走到位置的x值 y1:下 ...

  6. 这是一篇乖巧的草稿——vscode上传代码到代码托管平台GitHub

    一.在GitHub上创建一个远程仓库: 以上,就创建好了一个名为pythonStudy的仓库,现在先别把它关掉,先最小化 二.安装版本管理工具git:git属于无脑安装,可以更改安装路径 打开项目文件 ...

  7. 使用springboot cache + redis缓存时使用gzip压缩以提升性能

    背景 在高并发的场景中,我们通常会使用缓存提升性能.在使用springboot cache时,我们通常会使用基于JSON的序列化与反序列化. JSON具有可读性强,结构简单的特点,使用灵活. 但是JS ...

  8. python批量修改一个文件夹下含多个文件夹中的所有图片名称

    网上能找到的,大多是只对一个文件夹下所有图片进行重命名的代码. 这边实现的是,一个文件夹下有多个文件夹内图片的重命名. rename.py #!/usr/bin/python # -*- coding ...

  9. 01#Vue Transition 过渡：基于 CSS 过渡

    过渡的阶段 上图是过渡的 6 个阶段示意图.总体是进入和离开两个阶段,进入和离开又各自有两个阶段.下表格是对每一个阶段的解释: 进入和离开实现过渡效果使用的是 CSS 样式,过度的样式相当于重写覆盖了 ...

  10. Vue学习笔记之计算属性、内容分发、自定义事件

    1. 计算属性 计算属性的重点突出在属性两个字上(属性是名词),首先它是个属性其次这个属性有计算的能力(计算是动词),这里的计算就是个函数:简单点说,它就是一个能够将计算结果缓存起来的属性(将行为转化 ...