uni-app开发微信小程序数据 \n 换行符失效问题

2023-11-20

前言

使用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 代表匹配全文

使用这种方法,只能在text标签中生效,直接在view标签中使用这种方法不生效

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

uni-app开发微信小程序数据 \n 换行符失效问题 的相关文章

  • DNS欺骗原理及工作工程分析

    DNS欺骗 DNS欺骗是这样一种中间人攻击形式 它是攻击者冒充域名服务器的一种欺骗行为 它主要用于向主机提供错误DNS信息 当用户尝试浏览网页 例如IP地址为XXX XX XX XX 网址为www bankofamerica com 而实际
  • 工作与身体健康之间的平衡

    大厂裁员 称35岁以后体能下滑 无法继续高效率地完成工作 体重上涨 因为35岁以后新陈代谢开始变慢 甚至坐久了会腰疼 睡眠困扰开始加重 在众多的归因中 仿佛35岁的到来 会为一切的焦虑埋下伏笔 实际上 生理年龄不代表全部 体能素质的下降更与
  • 各种汇编器masm masm32 fasm nasm yasm gas的区别

    原文地址 http www verydemo com demo c269 i661 html masm MASM是微软公司开发的汇编开发环境 拥有可视化的开发界面 使开发人员不必再使用DOS环境进行汇编的开发 编译速度快 支持80x86汇编
  • Debug of AMBA AXI Outstanding Transactions

    Verifying today s complex designs is time consuming as simulations run for long time and millions of transaction are exe
  • Win7(WinDbg) + VMware(Win7) 双机调试环境搭建之三

    更多精彩内容 请见 http www 16boke com 环境 主机 Win7 虚拟机 VMware 11 1 0 build 2496824 虚拟机内操作系统 又称GuestOS Win7 WinDbg 适合调试机的相应位数的版本就可以
  • springboot使用Mybatis-Plus实现分页查询

    1 导入依赖 MyBatis Plus opens new window 简称 MP 是一个 MyBatis opens new window 的增强工具 在 MyBatis 的基础上只做增强不做改变 为简化开发 提高效率而生 我个人感觉使

随机推荐