微信小程序的text标签实现换行，空格等

1.实现效果

2.text标签

text标签内的\n会解释为换行，而\n在view标签内会被解释为空格。

text标签单个空格用\t,换行用\n。

当服务端返回的数据含有\n时候，用text标签。

3.服务端返回的\n变为\n

解决方法：
新建wxs文件：

var format = function (text) {
  if (!text) {
    return
  }
  var reg = getRegExp('\\\\n', 'g')
  return text.replace(reg, '\n')
}

module.exports = {
  format: format
}

在wxml页面中引入wxs

<wxs src="./filter.wxs" module="filter"></wxs>

<text>{{filter.format(data)}}</text>

// pages/wxCase/text/index.js
Page({

  /**
   * 页面的初始数据
   */
  data: {
    data: "苏苏就是\\n小苏苏，哈哈哈哈\\n，苏苏"
  },


  onLoad: function (options) {

  },


})

4.uniapp中

1.用v-html，可识别<br/>标签
如若想使用\n,可用正则将其转换为<br/>

.replace(/\n/g, '<br>')

2.用text标签

.replace(/\n/g，’\n’)替换文本中的所有\n换行符

5.写在最后🍒

看完本文如果觉得有用，记得点赞+关注+收藏鸭 🍕

更多小程序相关，关注🍥苏苏的bug，🍡苏苏的github，🍪苏苏的码云~