微信小程序-中英文文本换行的小问题

最新推荐文章于 2024-08-13 10:39:14 发布
最新推荐文章于 2024-08-13 10:39:14 发布
阅读量1.6k 收藏 1
点赞数 2
分类专栏： 小程序之旅 文章标签： 小程序 android ios
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/ITxiaodong/article/details/108412552
版权

现象

一个for循环出来的列表，居然有的换行且结尾省略，有的却不换行。
在这里插入图片描述

检查了半天没发现哪里写错布局，最后查看数据库中两个文本描述。一个是以中文结尾，一个是以英文结尾。猜想有可能是这个导致。原谅css没学好…

于是一顿操作，找到了word-break: break-all;这个样式，添加进去即可

效果

在这里插入图片描述

_龙衣
关注
专栏目录
微信小程序文本换行问题
weixin_50877746的博客
03-04 1018
我今天写小程序的时候遇到一个问题，长的英语文本不换行，导致这个text直接溢出边框外，不能够自动换行 解决方法 设置好宽度，在css属性上加入 word-break:break-all
微信小程序 view内英文数字不换行
每天都要努力学习哦~~
02-27 869
最近遇到一个bug，在一个text标签内，如果纯粹的中文字符那是可以换行的，如果text标签内出现了英文或者数字的组合，这个标签换行bug了，溢出了，OMG！我的天啊，赶紧去翻翻html5中遇到这样的问题怎么解决？果真有这样的bug，在H5中span标签连续英文不会换行，通过word-break:break-all可以修复这个问题，那么就去小程序添加这个css，测试一下，完美解决！
【微信小程序】实现中英文切换
最新发布
韩旭不会敲代码吧的博客
08-13 658
微信小程序实现中英文切换
小程序中文本自动换行
weixin_43398820的博客
08-17 4829
后端返回的文本自动换行 要求后端返回的文本在需要换行的地方增加\n 原生小程序中直接使用text标签即可，text中的文本遇到\n会自动换行。 // data: { // message:'这是第一个换行；\n,这是第二个换行；\n这是第三个换行；\n' // }, <text>{{message}}</text> taro框架中换行 // state = { // message: "这是第一个换行；\n,这是第二个换行；\n这是第三个换行；\
微信小程序 英语单词换行
feifei10244499的博客
09-28 871
摘自 link
微信推文中英文显示换行_如何从以前的推文中删除所有位置信息
culiyuan8310的博客
09-20 994
微信推文中英文显示换行Where you live is a pretty private location. Worryingly, it’s all too easy to leak it on social media without really meaning to. For example, it’s possible to share your exact location in a...
微信小程序中换行空格（多个空格）写法详解
Mencre的博客
11-25 2971
这篇文章主要介绍了微信小程序中换行空格（多个空格）写法详解,非常不错，具有一定的参考借鉴价值，需要的朋友可以参考下 在小程序中HTML的网页实体无法正常使用，小程序中的写法为： 一、空格，换行 <text>你好！\t七月流火啊！\n我在下一行</text> \t 空格（ 多个只会显示一个空格） \n 换行 二、连续空格 <view> &l...
微信小程序中text标签换行问题
soldier_d的博客
07-08 7225
在wxxml中加入text标签，当起始标签<text>和结束标签</text>都在一行的时候，文字不会换行 <view class="zjkj" style="flex-direction:column;"> <text class="kjts">中国福利彩票双色球 {{expect}} 期开奖号码</text> </view> 效果如下: 当起始标签<text>和结束标签</text>都不在一行的时候会
【小程序】view标签内全是数字或英文不换行
lily19970107的博客
11-27 665
小程序里view标签内全是数字或英文不换行，只需要加这句话就可以了～
解决微信小程序scroll-view换行问题
01-03
今天在写小程序的时候使用了scroll-view,但是发现在scroll-view中一行文字不能换行，代码如下： asdhadjhkajshdkjahsdkjasdajsdhkajsdkajsdkajsdhasjdaksj 发现scroll-view内的一大段英文只显示在一行，超出宽度...
微信小程序单行文本自动换行溢出部分省略号显示无效
04-17 1388
微信小程序单行文本溢出部分省略号显示无效,解决办法，亲测有效！ .text-cut { width: 300rpx; display: block; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } 另外这个标签，最好使用 ,不要使用 。 <view class="text_index text...
微信小程序 css使用技巧总结
08-31
微信小程序在开发过程中，CSS样式扮演着至关重要的角色，它能够帮助我们构建美观且功能丰富的用户界面。以下是一些关于微信小程序CSS使用技巧的详细说明： 1. **创建三角形** 创建一个纯CSS三角形的基本原理是利用...
微信小程序（十二）text组件详细介绍
09-01
在微信小程序中，`text`组件常与其他组件结合使用，例如`button`、`input`、`navigator`等，以实现各种交互效果。例如，`button`组件内的提示文本可以用`text`组件来展示。 `text`组件还可以与其他组件如`view`配合...
微信小程序-视图层
weixin_61514152的博客
03-30 535
提示：订阅零到一百微信小程序专栏学习吧！
微信公众号回复消息换行符处理
baidu_24707273的博客
12-11 7585
开发微信公众号时，回复微信消息有的会有换行符。我遇到过两种情况。 一、直接回复字符串，处理换行符只需要把字符串使用双引号包含即可，这种方法基本上都会，没有什么难度 二、从数据库读取带有换行符的文本        这时，换行符会被当成字符串，而不是特殊字符。这样的话，微信回复的也是文本。是不会出现换行的。我的处理方法是使用字符串替换函数，将换行符字符替换成换行符。 str_replace(...
微信小程序的text标签实现换行，空格等
苏苏就是小苏苏的博客
11-29 3万+
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,
小程序view英文数字不换行的问题
weixin_42488377的博客
06-28 4979
word-break:break-all;加这样一句话就可以啦
项目bug
weixin_34406061的博客
06-17 155
word-break: normal|break-all|keep-all; 值 描述 normal 使用浏览器默认的换行规则。 break-all 允许在单词内换行。 keep-all 只能在半角空格或连字符处换行。  
微信小程序的text 的换行
热门推荐
huhudeni的博客
05-19 3万+
笔者也是刚刚开始学习小程序 在text的组件上 换行发生了疑惑 看下面的代码 var text_fuzhu ='aaaa\ssss' var initData = 'this is first line\nthis is second line' var text_shuzhu=[]; Page({ /** * 页面的初始数据 */ data: { text: i...
微信小程序--中英文切换（1）
06-02
您好，我可以回答您关于微信小程序中英文切换的问题。 在微信小程序中实现中英文切换，可以通过以下两种方式： 1. 使用语言包 在开发微信小程序时，可以利用语言包来实现中英文切换。语言包是一个对象，包含了不同语言版本的文本内容，例如： ```javascript const lang = { 'zh-CN': { title: '中文标题', content: '中文内容' }, 'en': { title: 'English Title', content: 'English Content' } } ``` 在小程序中，可以通过获取用户设备的语言信息，来判断用户的语言偏好，并从语言包中获取对应的文本内容，例如： ```javascript const sysInfo = wx.getSystemInfoSync() const langType = sysInfo.language const lang = { 'zh-CN': { title: '中文标题', content: '中文内容' }, 'en': { title: 'English Title', content: 'English Content' } } const i18n = lang[langType] console.log(i18n.title) // 输出中文标题或英文标题 ``` 2. 使用第三方库 如果您觉得自己实现中英文切换的逻辑较为复杂，可以考虑使用第三方库来简化开发。目前市面上有很多支持多语言的小程序框架，例如 we18n、i18n-js 等，您可以选择适合自己的库来使用。 希望以上内容能够帮助您解决问题，如有疑问请随时向我提问。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

_龙衣

赏杯快乐水喝喝

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值