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

今天在写项目的时候，发现了一个京城性忽略的问题，在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