vue.js获取动态生成的元素,获取过来总是null!

今天做项目的时候,看见从后台获取过来的新闻信息有一些是没有图片的!于是就想写一个判断,判断如果获取来过的数据没有新闻图片就不要让这个数据在网页中展示出来也就是要让在页面展示这个数据的元素隐藏起来!可是写着写着,发现不对,怎么都无法获取对应的元素总是null!F12看了一下,原来是要等全部数据加载完成以后动态元素才会生成!这就完蛋了!在数据之前获取元素,获取不到!在数据之后获取元素,数据已经展示出来了!哎,请问大神有没有什么办法解决这个问题。叩谢!图片描述

阅读 7.4k
2 个回答

可以在渲染数据的时候给根据图片进行v-if的判断就可以过滤了,比如

<img :src='item.image' v-if='item.image'/>
//还可以加载根节点上
<li v-if='item.image'></li>
  • 获取的不是一个列表?

  • 获取到这个列表之后不是通过迭代(循环)显示每一条新闻?

迭代的时候跳过不符合条件的就好了啊……

如果你是指图片,也可以先取得图片之后再显示啊。通过 Image 对象加载图片,如果加载成功则渲染这个新闻。

另外,还可以让所有新闻一开始隐藏,如果图片加载出来,这一条就显示出来,加载出错,就不显示或者从 DOM 树删除掉(vue 的方式用不显示可能好做些)

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题