首页 > 其他分享 >#yyds干货盘点 【React工作记录五】如何处理数据格式字符串让它加上标签

#yyds干货盘点 【React工作记录五】如何处理数据格式字符串让它加上标签

时间:2023-03-05 12:00:37浏览次数:62  
标签:yyds 歌谣 49% 51% replace React 数据格式 能量


 

前言

我是歌谣 我有个兄弟 巅峰的时候排名c站总榜19 叫前端小歌谣 曾经我花了三年的时间创作了他 现在我要用五年的时间超越他 今天又是接近兄弟的一天人生难免坎坷 大不了从头再来 歌谣的意志是永恒的 放弃很容易 但是坚持一定很酷

需求

今天我们公司领导找我 说这边有个需求需要你做一下 就是一个ant design table得table栏里面返回了一些数据格式


首先我们来看看数据格式

每一个人或动植物,\r\n都是由阴阳两种能量组合而成。
\r\n男人身上有51%是阳性能量

,\r\n有49%是阴性能量,\r\n女人身上有51%的阴性能量,\r\n有49%的阳性能量。\
r\n每个人几乎都有一半的能量在沉睡,
\r\n因此会不停寻找另外那一半,\r\

#yyds干货盘点 【React工作记录五】如何处理数据格式字符串让它加上标签_数据格式

解决思路

title: '语录内容',

align: 'center',
dataIndex: 'content',
render:(text)=>{

return <p dangerouslySetInnerHTML
={{ __html: text.replace(/\n/g,"<br/>") }}></p>
}

#yyds干货盘点 【React工作记录五】如何处理数据格式字符串让它加上标签_字符串_02

总结

要点1 replace用的正则匹配完成得

要点2 dangerouslySetInnerHTML解析字符串 转换

运行结果

#yyds干货盘点 【React工作记录五】如何处理数据格式字符串让它加上标签_数据格式_03

#yyds干货盘点 【React工作记录五】如何处理数据格式字符串让它加上标签_字符串_04编辑

 换行完成


标签:yyds,歌谣,49%,51%,replace,React,数据格式,能量
From: https://blog.51cto.com/u_14476028/6101358

相关文章

  • #yyds干货盘点# LeetCode程序员面试金典:T9键盘
    题目:在老式手机上,用户通过数字键盘输入,手机将提供与这些数字相匹配的单词列表。每个数字映射到0至4个字母。给定一个数字序列,实现一个算法来返回匹配单词的列表。你会得到一......
  • #yyds干货盘点# LeetCode面试题:外观数列
    1.简述:给定一个正整数n,输出外观数列的第n项。「外观数列」是一个整数序列,从数字1开始,序列中的每一项都是对前一项的描述。你可以将其视作是由递归公式定义的数字字符......
  • 完整手写react第三天
    实现JSX打包React项目结构:react(宿主环境无关的公用方法)react-reconciler(协调器的实现,宿主环境无关)各种宿主环境的包shared(公用辅助方法,宿主环境无关)实现jsx方法包......
  • React.memo 解决函数组件重复渲染
    为什么会存在重复渲染?react在v16.8版本引入了全新的api,叫做ReactHooks,它的使用与以往基于classcomponent的组件用法非常的不一样,不再是基于类,而是基于函数进行......
  • #yyds干货盘点#nginx正则表达式
    nginx正则匹配说明:细则:前缀匹配优先其中,最长匹配优先而后,按配置顺序匹配正则,正则第一个匹配到后终止无正则匹配,则用前面记住的前缀"="精确匹配,匹配后终止"~"区分大小写匹......
  • #yyds干货盘点#nginx的root 与 alias
    nginx指定文件路径有两种方式root和alias,主要区别在于nginx如何解释location后面的uri,这会使两者分别以不同的方式将请求映射到服务器文件上。它们的使用方法和作......
  • 常见传输数据格式Content-Type
    在响应中,Content-Type标头告诉客户端实际返回的内容的内容类型。浏览器会在某些情况下进行MIME查找,并不一定遵循此标题的值;为了防止这种行为,可以将标题X-Content-Ty......
  • React-crm的权限管理总结
    引言最近在写react-redux的后台管理系统,我觉得权限管理挺重要的,在此总结一下。大致流程配置axios,解决代理以调用接口获取数据用户登陆调用接口,获取传入token以允许登......
  • HelloReact
    单页面中使用React在单页面中使用React需要引入三个js:React的核心库、依赖核心库、babel(编译JSX)<scriptcrossoriginsrc="https://unpkg.com/react@16/umd/react.dev......
  • #yyds干货盘点# LeetCode程序员面试金典:水域大小
    题目:你有一个用于表示一片土地的整数矩阵land,该矩阵中每个点的值代表对应地点的海拔高度。若值为0则表示水域。由垂直、水平或对角连接的水域为池塘。池塘的大小是指相连接......