前言
使用uni-app开发微信小程序时,使用text显示字符串(字符串带\n),需要在\n处直接换行。
1、本地字符串,可以直接换行显示。
2、后台返回字符串,直接换行失效。原因:渲染时 \n 直接被当成字符串处理了,根本不识别。
效果图
实现
1、使用replace()方法,字符串内的 \n 做一次替换。
具体演示代码
1、使用后台返回字符串
<!-- 替换第一个\n -->
<text>{{ name.replace(/\\n/,'\n') }}</text>
<!-- 全部替换 -->
<text>{{ name.replace(/\\n/g,'\n') }}</text>
2、使用本地字符串
<template>
<view>
<text>{{ name }}</text>
</view>
</template>
<script>
export default {
data() {
return {
name: '周二至周五 10:00-19:00\n周六至周日 09:00-19:00 \n周一闭馆'
}
}
}
</script>
PS:
var str = "namehagna".replace("a",""); 则只会替换第一个a
var str = "namehagna".replace(/a/g,""); 会替换所有: /g 代表匹配全文文章来源:https://www.toymoban.com/news/detail-606619.html
使用这种方法,只能在text标签中生效,直接在view标签中使用这种方法不生效文章来源地址https://www.toymoban.com/news/detail-606619.html
到了这里,关于uni-app开发微信小程序数据 \n 换行符失效问题的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!