1. 程式人生 > >使用JQuery AJAX 解決vue中圖表渲染非同步問題

使用JQuery AJAX 解決vue中圖表渲染非同步問題

vue一般使用axios 傳送請求,得到  一個promise物件,一般對資料進行處理是在.then()方法中執行,如:
CommonApi.EnumType.getBusinessTypes({}).then(data => {
          CommonApi.EnumType.getNodeTypes({ businessTypes: data.data.map(item => item.value).join() }).then(nestedData => {
            this.nodeTypes = nestedData.data
          })
        })

.then()方法非同步處理資料,如下面的程式碼111有可能會比123早輸出,這就是非同步。

.then(()->{
console.log('123')
})
console.log('111')

詳細可檢視promise文件。

所以頁面可能會出不來資料,以下為同步方法

  方法名(引數(可選)) {
    return $.ajax({
      url: url,
      async : false,
      type : 'GET',
      beforeSend: function(request) {/**token資訊可選*/
        request.setRequestHeader("Authorization", getToken())
      },
      dataType : 'json/xml/html',
      success : function (result) {
        return result
      }
    }).responseText
  }