3.0.2新版本taro text标签 decode换行处理失效

[dreamthen]

相关平台

微信小程序

复现仓库

https://github.com/dreamthen/PetPlanet-demo
小程序基础库: 2.11.3
使用框架: React

复现步骤

拉取代码，直接使用111111\n，就可以看到，decode对于换行符不起作用

期望结果

taro text标签 decode换行处理生效

实际结果

taro text标签 decode换行处理失效

环境信息

👽 Taro v3.0.2


  Taro CLI 3.0.2 environment info:
    System:
      OS: macOS 10.15.5
      Shell: 3.2.57 - /bin/bash
    Binaries:
      Node: 12.18.0 - /usr/local/bin/node
      Yarn: 1.22.4 - /usr/local/bin/yarn
      npm: 6.14.6 - /usr/local/bin/npm
    npmPackages:
      @tarojs/components: 3.0.2 => 3.0.2 
      @tarojs/mini-runner: 3.0.2 => 3.0.2 
      @tarojs/react: 3.0.2 => 3.0.2 
      @tarojs/runtime: 3.0.2 => 3.0.2 
      @tarojs/taro: 3.0.2 => 3.0.2 
      @tarojs/webpack-runner: 3.0.2 => 3.0.2 
      babel-preset-taro: 3.0.2 => 3.0.2 
      eslint-config-taro: 3.0.2 => 3.0.2 
      nerv-devtools: 1.5.7 => 1.5.7 
      nervjs: 1.5.7 => 1.5.7 
      react: ^16.10.0 => 16.13.1 
    npmGlobalPackages:
      typescript: 2.8.3

[dreamthen]

@Chen-jj @luckyadam

[dreamthen]

感觉这个问题很严重呀，Text标签不能处理换行符，这是比较基础的问题呀

[Chen-jj]

@dreamthen \n 应该被 react 转了为 \\n，这样写吧：

<Text decode dangerouslySetInnerHTML={{ __html: '1111\n'}}  />

[dreamthen]

好的，我试一下

[qingsikou]

@dreamthen \n 应该被 react 转了为 \\n，这样写吧：

<Text decode dangerouslySetInnerHTML={{ __html: '1111\n'}}  />

还是无效

[toFrankie]

@dreamthen \n 应该被 react 转了为 \\n，这样写吧：

<Text decode dangerouslySetInnerHTML={{ __html: '1111\n'}}  />

还是无效

1. 对需要渲染的字符串处理：str.replace(/\\n/g, '\n')；
2. 其次需要设置 white-space: pre-wrap。

写原生小程序，也会将 \n 转为 \\n 的。