mounted(){ //页面渲染之后 created this.createPlayer() }, }; 排查 对后端接口进行了DEBUG,发现获取到的id为undefined。 我就纳闷了这是什么鬼情况。对前端进行DEBUG,发现赋值后的视频id和播放凭证仍是空。 看到这,我怀疑是this的锅,将视频id的赋值放到异步请求外,发现输出了undefined,离谱....
所以在mounted钩子中使用$refs,如果ref是定位在有v-if、v-for、v-show的 DOM 节点中,返回来的只能是undefined,因为在mounted阶段他们根本不存在。 如果说mounted阶段是加载阶段,那么updated阶段则是完成了数据更新到 DOM 的阶段(对加载回来的数据进行处理),此时,再使用this.$refs.xx,就 100% 能找到该 DOM 节点。
所以如果在mounted钩子中使用$refs,如果ref是定位在有v-if、v-for、v-show中的DOM节点,这些判断下的DOM还没渲染,返回来的只能是undefined,因为在mounted阶段他们根本不存在!!! 如果说mounted阶段是加载阶段,那么updated阶段则是完成了数据更新到DOM的阶段(对加载回来的数据进行处理),此时,ref、数据等等全部都挂载到D...
此时的mounted阶段,一般是用于发起后端请求,拿回数据,配合路由钩子做一些事情,简单来说就是在mounted钩子中加载数据而已,加载回来的数据是不会再这个阶段更新的DOM中的 所以如果在mounted钩子中使用$refs,如果ref是定位在有v-if、v-for、v-show中的DOM节点,返回来的只能是undefined,因为在mounted阶段他们根本不存在!!
一、提示undefined 这种情况下,一般都是父组件调用子组件方法的时候,子组件还未渲染成功。要搞清楚这个问题,我们要搞清楚父子组件的生命周期就行了。 1,加载渲染过程 父beforeCreate->父created->父beforeMount->子beforeCreate->子created->子beforeMount->子mounted->父mounted ...
在使用异步数据(如API调用)时,数据在请求完成前是undefined。这通常发生在生命周期钩子函数中,如created或mounted。 export default { data() { return { myData: undefined }; }, created() { fetch('https://api.example.com/data') .then(response => response.json()) ...
在Vue中,如果在mounted生命周期钩子中打印computed计算属性得到undefined,可能是由于多种原因导致的。下面我将根据提供的tips逐一分析可能的原因,并给出相应的解决方案。 1. 确认computed属性在Vue组件中的正确定义 首先,确保computed属性在Vue组件中已正确定义。computed属性应该是一个对象,其键是计算属性的名称,值是一个...
mounted阶段的打印尝试,其余的也类似: mounted(){ console.log("mounted↓") console.log(this.users) }从vuex getter获取到的数据: computed:mapGetters({ users:'allUsers' }),打印结果:经过观察发现,vue组件生命周期的11个阶段,只有前6个阶段有输出结果。beforeDestroy,destroyed,activated,deactivated,error...
log(_this.index[0]); }); console.log("mounted"); } 不出意外的话,你会发现这两种情况依然会抛出undefined的错误。 但是这里与逻辑是相悖的,既然我选择在页面渲染之前获取到数据,为什么依然会报错? 猜测:网络问题 由于axios是异步的,也许在created时,真的执行了axios语句,但是由于网络问题,加载的时间大于...
vue中使用refs定位dom出现undefined的解决方法 之前在公司做项目,一直感觉用ref来定位dom节点挺方便的。但是期间遇到了一个问题,就是在mounted(){}钩子里面http://使用this.$refs.xxx,打印出来的却是undefined? 于是我就对比了一下之前使用ref定位的.vue文件,发现了他们之间的区别。