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()
              }
          })
      },

哈哈哈~~~~   解決啦  小問題是最容易被忽略的~

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM