1.问题
at Proxy.render (eval at ./node_modules/vue-loader/lib/template-compiler/index.js?{"id":"data-v-6900a511","hasScoped":true,"transformToRequire":{"video":["src","poster"],"source":"src","img":"src","image":"xlink:href"},"buble":{"transforms":{}}}!./node_modules/vue-loader/lib/selector.js?type=template&index=0!./src/components/first1.vue (app.js:3200), <anonymous>:17:50)
报错就是这个样子的,但是数据其实是渲染出来了,这个问题是因为一开始渲染的时候数据还没来,等数据来了之后又重新渲染了一遍,所以我们既看到了数据有看到了报错。
我一开始想的是mounted里接收一下,在刚开始挂载的时候就差处理这个数据,但是实际上是拿不到的。
上一行是能拿到的,但是下面就拿不到了,搜了一下,貌似上面也是不应该拿到了,但是问题到这里差不多就能想到就是时间先后的问题,自然而然的想到了延时器。
2.1延时器
在元素上面写一个v-if判断一下
但是有个问题,这个办法虽然不会报错了,也会显示,但是会造成闪一下的画面,因为一开始渲染了,不显示,0.5秒以后渲染显示页面,页面就会忽然出现,也想过把时间改短一点,人眼分辨不出来的地步,但是毕竟不是很正统的办法。
2.1监听办法
后来又搜了搜有监听的办法,当然这个也需要一个判断
打印出来也有效果,刷新之后也不报错
但是这个办法也有个问题,就是我们开发肯定是时不时在改代码的,vue里肯定都是热更新,改了代码之后自动更新,问题就来了,这个监听在你改了代码之后并不会出发,毕竟first1data这个数据没有更改,然后就又出现问题,因为v-fi那个更改是在监听里的,这下好了,模块直接隐藏掉了,虽然一开始不会报错,但是对于开发是不友好的
2.3v-fi
v-if简单粗暴,如果需要渲染就直接在上面写一个v-if
解决了。。。。
2.4最后
不过我总感觉应该还有别的办法,但是还没找到,如果哪位看官有找到更合适的办法,麻烦告诉我下,谢谢