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

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

  • 相关阅读:
    8张图带你轻松温习 Java 知识.md
    关于 Java 序列化你不知道的 5 件事
    为什么 String 是不可变的?
    如何使用 Nginx 优雅地限流?
    JAVA泛型编程笔记
    java_接口的应用
    java_抽象类应用
    深入理解Java的接口和抽象类
    java_重写与重载的区别
    Java:按值传递还是按引用传递详细解说
  • 原文地址:https://www.cnblogs.com/Mrs-pao/p/8043586.html
Copyright © 2020-2023  润新知