vue中,写在methods里的B方法去调A方法的数据,访问不到?

it2022-05-07  28

今天在写项目的时候,发现了一个京城性忽略的问题,在vue的methods的方法里面定义了两个方法,如下:

getTaskList() { api.growthDetails.taskList({ appChannel: this.$isH5 ? 2 : 1 }).then(res => { if (res.data.obj) { // 取数据 let resData = JSON.parse(res.data.obj) || {}; this.taskList = resData // 获取列表内容 this.listData = resData.list && resData.list // 需要传到详情页的字段 this.eventId = this.listData[0].eventId this.taskCode = this.listData[0].taskCode this.eventTypeId = this.listData[0].eventTypeId } }) }, // 获取商品详情信息 getTaskDetail() { console.log('***', this.eventId) api.growthDetails.taskDetail({ eventId: this.eventId, taskCode: this.taskCode, memberId: this.memberId, appChannel: this.$isH5 ? 2 : 1, eventTypeId: this.eventTypeId }).then(res => { console.log(res) if (res.body.obj) { this.taskDetail = JSON.parse(res.body.obj) || {} // 判断title的长度 this.taskName = this.taskDetail.taskName // 转换时间 this.taskDetail.startTime = utils.dateFormat("yyyy-MM-dd", this.taskDetail.startTime) this.taskDetail.endTime = utils.dateFormat("yyyy-MM-dd", this.taskDetail.endTime) } }) }

我是在登录之后,进行调用的~

isLogin() { utils.isLogin(true).then(user => { this.memberToken = user.member_token this.memberId = user.member_id // 获取商品列表信息 this.getTaskList()         this.getTaskDetail() }) },

其中getTaskDetail的方法中传入的参数,用的是从getTaskList取出来的存放的,但是在控制台打印不出存放的变量~~~~~~ 

然后,就去问了一下我的师傅,哈哈,一语道破~~

【思路】:

在A方法里面,将所需要的字段进行存储,这些字段在data中已经定义过,在B方法中,需要用到这些变量,直接用this.变量名,原则上是可以了,但是,

有一个地方要考虑一下,就是A方法里存储的时间, 肯定调接口然后存储, 接口是异步的, 一定要等这个接口成功,值存储好了   B方法才可以执行,不要A方法没来得及存储,就执行B方法

 

【怎么解决呢】

等A方法结束之后,在调用B方法,这是才能保证B方法中调用A方法的变量才会有值,有点类似于promise的思想,至于如何解决,就更简单了~~~

把isLogin里面改为:

isLogin() { utils.isLogin(true).then(user => { this.memberToken = user.member_token this.memberId = user.member_id // 获取商品列表信息 this.getTaskList()         // 去掉获取商品详情的方法 }) },

将商品详情的方法放到getTaskList获取商品成功之后写~

getTaskList() { api.growthDetails.taskList({ appChannel: this.$isH5 ? 2 : 1 }).then(res => { if (res.data.obj) { // 取数据 let resData = JSON.parse(res.data.obj) || {}; this.taskList = resData // 获取列表内容 this.listData = resData.list && resData.list // 需要传到详情页的字段 this.eventId = this.listData[0].eventId this.taskCode = this.listData[0].taskCode this.eventTypeId = this.listData[0].eventTypeId // 调用详情页 this.getTaskDetail() } }) },

哈哈哈~~~~   解决啦  小问题是最容易被忽略的~

 

转载于:https://www.cnblogs.com/Mrs-pao/p/8043586.html


最新回复(0)