网络不佳的情况下，created和watch触发同一个接口函数导致功能异常，应该怎么解决呢？

Question

当网络不好的情况下，created和watch触发同一个接口函数，导致功能异常。代码如下：
经检查，created中首先调用 getMenuData()，当getMenu()接口中还没执行完会又会触发 menu()方法，而 menu()中的判断条件this.authorizationList.length === 0 不成立是 getMenuData() 先执行完才不为空，所以导致 getMenuData()再次被调用。那么怎么解决这个问题呢？打印顺序是：889 -> 1 -> 2 -> 889 -> 556 -> 556；

created () {
    this.getMenuData()
  },
  watch: {
    menu (value) {
      this.isExistMenu = false
      console.log(1)
      if (this.authorizationList.length === 0) {
        console.log(2)
        this.getMenuData().then(res => {
          console.log('res', res)
          this.getSubByMain(res, value)
          this.triggerSubMenu()
        })
      } else {
        console.log(33)
        this.getSubByMain(this.authorizationList, value)
        this.triggerSubMenu()
      }
    }
  },
  methods: {
    // 获取权限列表
    getMenuData () {
      console.log(889)
      return new Promise((resolve, reject) => {
        if (this.headMenus.length === 0) {
          getMenu(this.forms).then(res => {
            if (res.code === 100) {
              this.userDataList = res.data
              this.authorizationList = res.data.menuList[0].children
              // 这里拼装头部菜单信息
              this.authorizationList.forEach((value) => {
                let mData = {}
                mData.menuText = value.menuText
                mData.menuUrl = value.menuUrl
                this.headMenus.push(mData)
              })
              console.log(566)
              // 将拿到的头部菜单信息保存在sessionStorage中
              window.sessionStorage.setItem('headMenus',         JSON.stringify(this.headMenus))
              // 将拿到的用户信息保存在sessionStorage中
              window.sessionStorage.setItem('userDataList', JSON.stringify(this.userDataList))
              // 将拿到的权限信息保存在sessionStorage中
              window.sessionStorage.setItem('authorizationList', JSON.stringify(this.authorizationList))
              bus.$emit('sideInitialization', this.authorizationList)
              resolve(res.data.menuList[0].children)
            } else {
              this.$message(res.message)
              reject(res)
            }
          }).catch((e) => {
            reject(e)
          })
        }
      })
    },

Answer 1

为什么menu触发 你修改了？

Answer 2

不确定menu是做什么处理的，可以打印下menu，看逻辑本身就可能执行两次，建议重新梳理一下逻辑。