页面数据渲染

Question

老师我根据视频代码准备进行tab列表数据的格式排版，写完后在微信小程序的浏览界面看不到数据，但是数据是可以打印出来。后来我在html5页面下运行浏览，列表数据能够进行正常的渲染，很疑惑这是什么问题。
微信小程序界面及代码

html5界面

更新内容

微信开发者工具dom结构:


H5页面DOM结构：

代码警告：

Answer 1

Sunday 2021-08-26 15:09:39

你的mytabs组件注册怎么写到data里面了？应该写到components选项下

• 提问者 qq_慕姐1024111 #1

  这段代码自动生成不知道是不是不小心动到还是生成错了，换好位置可以渲染了，终于好了。谢谢老师!

Answer 2

Sunday 2021-08-26 12:41:37

从你给出的截图来看， my-tabs 组件渲染出来的高度为0。

这种情况下一般只存在两种可能：

1. 数据压根就没有渲染上去。

2. 数据渲染了，但是因为样式i问题导致的高度为0，不显示。

你可以展开 dom 来仔细查看：

查看一下 是否存在 第一个 红框 中的 dom 。 如果存在则是 第二个可能，如果不存在则是 第一个可能

• 提问者 qq_慕姐1024111 #1

  第一个红框的内容是有的，第二个红框到class="tab-item"以后的内容都是空的，样式应该是没有问题的，H5页面还是能够渲染出来的。
  我发现hot.vue文件自己生成了一些组件注册的代码，其中有一些代码是淡色显示警告，不知道是不是这个原因。警告详情我更新在问题了

Answer 3

Sunday 2021-08-25 10:15:35

如果是这种情况的话，有可能是缓存问题。可以试试重启小程序项目

• 提问者 qq_慕姐1024111 #1

  重启了几次，还是没能解决QAQ

• Sunday 回复 提问者 qq_慕姐1024111 #2

  如果不是缓存问题，那么就有可能是以下两个问题的一种
  1  数据没有被渲染 检查下数据内容是否正常
  2  渲染成功但是不可见。可以在小程序的调试工具中查看dom的方式查看下是否存在被渲染的dom

• 提问者 qq_慕姐1024111 回复 Sunday #3

  我查看了下2个端，数据传输的话都是通过打印检查都是有数据的，dom的话Html5页面可以查看到被渲染的dom，小程序这里只能看到部分被渲染的结构，但是最终数据列没有被渲染出来， 详情页我更新在问题了，老师你看还能解决吗。。。