Async / await stopped working after upgrade

[robsontenorio]

My previous versions:

 JS
 ----
 "vue": "^2.6.12"
 "@inertiajs/inertia": "^0.8.6",
 "@inertiajs/inertia-vue": "^0.5.9",
 "@inertiajs/progress": "^0.2.4",

  PHP
  ----
  "inertiajs/inertia-laravel": "^0.4.1",

Upgraded to latest version:

 JS
 ----
 "vue": "^2.6.14"
 "@inertiajs/inertia": "^0.10.1",
 "@inertiajs/inertia-vue": "^0.7.2",
 "@inertiajs/progress": "^0.2.6",

  PHP
  ----
  "inertiajs/inertia-laravel": "^0.4.5",

This code used to work on PREVIOUS VERSION

 data(){
    return {
         loading: false
    } 
 },
 ...
 async loadUser(id) {

      this.loading = true;

      await this.$inertia.visit(`/users/${id}`, {
           preserveState: true,
           preserveScroll: true,
      });

      this.loading = false;
    },

After upgrading to latest versions I have noticed from VueDevTools that this.loading does not change its value when doing a visit. If I switch from this.$inertia.visit(...) to axios.get(...) the variables works as expected.

Am I missing something?

Note: yes, I could do it with promises, but in this case I would prefer async/await.

[enzonotario]

Visit promise is deprecated since [email protected].

[taozuhong]

Why? is there a replacement for this?

[robsontenorio]

@enzonotario

mounted() {
    this.tab = this.$page.props.query?.tab || "first";
},
data(){
   return {
       loading: false,
       tab: ""
   }
},
watch: {
    tabs(value) {
         this.loadTab(value)
   }
},
methods: {
  loadTab(tab) {
      this.$inertia.reload({
        only: [tab],
        onStart: () => (this.loading = true),
        onFinish: () => (this.loading = false),
      });
    },
},

Just noticed this.$inertia.reload events are no properly fired when visiting this component. My main issue here is to get this "loading" working as expected. It does not trigger onStart, so i dont get loading as true.

From any orgin page:

It works with <a href="/my-page?tab=third"> go </a>
But not woks with this.$inertia.visit('/my-page?tab=third')