uni-app iphone 6s rich-text node不显示
uni-app iphone 6s rich-text node不显示
操作步骤:
- 6s上运行
预期结果:
- 正常显示 rich-text 里的文本信息
实际结果:
- 什么也不显示
bug描述:
- rich-text 在6s上不显示 文本 iphoneX上正常
信息类别 | 详细信息 |
---|---|
产品分类 | uniapp/App |
PC开发环境 | Mac |
PC操作系统版本 | Retina, 13-inch, 2020 |
手机系统 | iOS |
手机系统版本 | iOS 14 |
手机厂商 | 苹果 |
手机机型 | iphone6s |
页面类型 | vue |
vue版本 | vue3 |
打包方式 | 离线 |
项目创建方式 | CLI |
CLI版本号 | 3 |
刚试了,可以显示 iphone 6s
<template>
<view class="content">
<page-head :title="title"></page-head>
<view class="uni-padding-wrap">
<view class="uni-title uni-common-mt">
数组类型
<text>\nnodes属性为Array</text>
</view>
<view class="uni-common-mt" style="background:#FFF; padding:20rpx;">
<rich-text :nodes="nodes"></rich-text>
</view>
<view class="uni-title uni-common-mt">
字符串类型
<text>\nnodes属性为String</text>
</view>
<view class="uni-common-mt" style="background:#FFF; padding:20rpx;">
<rich-text :nodes="strings"></rich-text>
</view>
</view>
</view>
</template>


是RegExp失效 在iphone6 上 在iphoneX上是好的
let reg = /(?<=<body>).*?(?=</body>)/; let content = data.match(reg); 在iPhone6s上会失效
回复 果李程: 我测试的rich-text 是6s ,正则换个写法
在 uni-app 中使用 rich-text
组件时,如果在 iPhone 6s 上遇到节点不显示的问题,可能是由于以下原因之一:
1. 样式问题
- 检查样式:确保
rich-text
中的内容样式是兼容的。某些 CSS 样式在 iOS 上可能表现不同,导致内容不显示。 - 字体大小:确保字体大小不为 0 或者过小。
- 布局问题:检查父容器的布局是否导致了
rich-text
内容被裁剪或者隐藏。
2. 数据格式问题
- 数据格式:
rich-text
组件支持nodes
属性,该属性可以是字符串或节点数组。确保你的数据格式正确。 - HTML 标签:如果你传递的是 HTML 字符串,确保 HTML 标签是合法的,并且没有被错误地解析。
3. 平台差异
- 平台差异:uni-app 在不同平台上的表现可能会有所不同。确保你的代码在所有目标平台上都进行了测试。
- 兼容性问题:某些 HTML 标签或 CSS 属性在 iOS 上可能不受支持或不完全兼容。
4. 缓存问题
- 清除缓存:有时候,缓存可能导致页面显示异常。尝试清除微信开发者工具的缓存或者真机调试时清除应用缓存。
5. uni-app 版本问题
- 版本兼容性:确保你使用的是最新版本的 uni-app,旧版本可能存在一些已知的 bug。
6. 调试工具
- 使用调试工具:在微信开发者工具或 Safari 的开发者工具中查看
rich-text
组件的渲染结果,查看是否有错误或警告信息。
示例代码
以下是一个简单的 rich-text
使用示例:
<template>
<view>
<rich-text :nodes="htmlNodes"></rich-text>
</view>
</template>
<script>
export default {
data() {
return {
htmlNodes: [
{
name: 'div',
attrs: {
style: 'color: red; font-size: 20px;'
},
children: [
{
type: 'text',
text: 'Hello, world!'
}
]
}
]
};
}
};
</script>