[Vuejs]-Create component on the fly with custom data

0πŸ‘

βœ…

At the end I have implemented this to solve my problem:

authenticated.interceptors.response.use(
  response => {
    return response
  },
  error => {
    if (error.code === 'ECONNABORTED') {
      return new Promise((resolve, reject) => {
        var modalDialogId = "timeout-modal-dialog";
        if($('#' + modalDialogId).length){
          instance.$children[0].loadingComplete = true;
        } else {
          var ComponentClass = Vue.extend(TimeoutModalDialog);
          instance = new ComponentClass({
            propsData: {
              retryFunction: function () {
                instance.$children[0].loadingComplete = false;
                authenticated.request(error.config).then((response) => {
                  instance.$children[0].loadingComplete = true;
                  $("#" + modalDialogId).modal("close");
                  resolve(response);
                }, (error) => {
                  instance.$children[0].loadingComplete = true;
                  reject(error);
                })
              },
              cancelFunction: function () {
                instance.$children[0].loadingComplete = true;
                $("#" + modalDialogId).modal("close");
                reject(error);
              },
              dialogId: modalDialogId
            }
          });
          instance.$mount();
          document.getElementById('modalVueGeneric').appendChild(instance.$el);
        }
      });
    } else {
      return Promise.reject(error);
    }
  }
);

And it solves my problem.

Thanks Laran for your suggestion.

Leave a comment