换行符在字符串中不被解析

莲青见卿

已于 2022-11-02 17:16:11 修改

阅读量562

点赞数 1

分类专栏：前端基础文章标签：换行符页面渲染 CSS样式 white-space 文本格式

于 2020-11-13 19:19:14 首次发布

本文链接：https://blog.csdn.net/vh_YUNYANGYUMO/article/details/109680849

版权

前端基础专栏收录该内容

13 篇文章 0 订阅

订阅专栏

字符串中出现换行符时，我们在渲染页面中，无法解析到换行符，就像这样：

 const dayTableArr = [
    {
      title: '新秀榜奖励',
      context: [{ one: '第一名', two: '2000彩币+封面角标\n+神秘实物奖励' },
        { one: '第二名', two: '1500彩币+神秘实物奖励' },
        { one: '第三名', two: '500彩币+神秘实物奖励' }]
    },
    {
      title: '王者之声奖励',
      context: [{ one: '第一名', two: '8%钻石奖励+证书' },
        { one: '第二名', two: '5%钻石奖励+证书' },
        { one: '第三名', two: '2%钻石奖励+证书' },
        { one: '前十名', two: '冬季勋章' }]
    },
    {
      title: '最佳助力榜奖励',
      context: [{ one: '第一名', two: '火凤凰进场特效*30天' },
        { one: '第二名', two: '火凤凰进场特效*25天' },
        { one: '第三名', two: '火凤凰进场特效*20天' },
        { one: '第四名', two: '火凤凰进场特效*15天' },
        { one: '第五名', two: '火凤凰进场特效*10天' },
        { one: '第六名', two: '火凤凰进场特效*5天' }]
    }
  ]