uni-app iphone 6s rich-text node不显示

发布于 1周前 作者 phonegap100 来自 Uni-App

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

5 回复

刚试了,可以显示 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>

<script> export default { data() { return { title: 'rich-text', nodes: [{ name: 'div', attrs: { class: 'div-class', style: 'line-height: 60px; color: red; text-align:center;' }, children: [{ type: 'text', text: 'Hello uni-app!' }] }], strings: '
' } } } </script>


是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>
回到顶部
AI 助手
你好,我是IT营的 AI 助手
您可以尝试点击下方的快捷入口开启体验!