vue生命周期问题

场景:分页父组件通过axios取到后端laravel的数据flightdata,flightdata中包含一个总页数total,每页显示数据条数per_page
父组件:向子组件pager传page、last和path,last是通过total/per_page向上取整计算出来的,问题就出在它上面
子组件:
发现问题:子组件的pagerRender()方法要用到父组件传给子组件的值last但是父组件却不能第一时间把last最新的值传给子组件:
我将父组件的last赋一个值99,父组件应该在created阶段通过getData()方法给last赋成真实页数的值,比如5
我子组件中的created阶段通过pagerRender()方法将last的值赋给_last,按理来说,最后{{last}}和{{_last}}都该是真实页数5,但是第一时间打开页面时{{_last}}的值其实是99,{{last}}值为5,难道last的值传进子组件两次?!
改变页数(点击上下页)后{{_last}}才开始和{{last}}同步,就是说第一次渲染页面的时候last的最新值没有第一时间传到子组件
但是同时{{current}}和{{_current}}的值都是对的
我觉得我对生命周期理解出了什么问题,但是确实找不到原因
aluckdog
浏览 377回答 2
2回答

ibeautiful

在子组件添加last的watchwatch:{'$route'(to,from){this.prev_and_next()this.pagerRender()},'last'(to,from){this.pagerRender()}},解决了这个问题

慕侠2389804

axios的通讯是异步的,即便父组件created时候开始的,但是得到的时候可能已经是子组件_last已经赋值了;建议放到router.query或者param里面,再有子组件wtach赋值;这样旧值依然会在;
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript