Vue 2 About nextTick

I read that nextTick allows codes to run on the next action. But this does not work in my code, can someone help me with this? Please correct me. Thank.

.vue

.....
methods:{
      getUserInfo(){
        var vm = this
        vm.$http.get('/getAuthUser').then((response)=>{
          vm.user = response.data
        })
        Vue.nextTick(()=>{
          vm.$http.get('/getShop/'+vm.user.id).then((response)=>{
            vm.shop = response.data.data.shop
          })
        })
      },
}
.....

{{user.id}}works. where this gives me the following error:

GET http: // localhost: 8000 / getShop / undefined 404 (not found)

EDIT # 1 if I do something like this, it works, but it should not be the right way, in my opinion.

.....
methods:{
      getUserInfo(){
        var vm = this
        vm.$http.get('/getAuthUser').then((response)=>{
          vm.user = response.data
          vm.$http.get('/getShop/'+vm.user.id).then((response)=>{
            vm.shop = response.data.data.shop
          })
        })
      },
}
.....

EDIT # 2 If I do something like this, it will not work, then com vm.user.id is not installed.

.....
methods:{
      getUserInfo(){
        var vm = this
        vm.$http.get('/getAuthUser').then((response)=>{
          vm.user = response.data
        })
        vm.$http.get('/getShop/'+vm.user.id).then((response)=>{
          vm.shop = response.data.data.shop
        })
      },
}
.....
+4
source share
1 answer

, , nextTick, . , , , nextTick, DOM.

, , , DOM v-if. , DOM, , , , Vue DOM, , . Vue.nextTick, , , DOM , .

DOM.

2 HTTP-, , . (EDIT # 2) , , HTTP- , , , vm.user.id.

(EDIT # 1) , HTTP . , :

getUserInfo() {
    vm.$http.get('/getAuthUser')
        .then(response => {
            vm.user = response.data;

            return vm.$http.get('/getShop/' + vm.user.id);
        }).then(response => {
            vm.shop = response.data.data.shop;
        });
}

a Promise, then. , then s. MDN Promises.

+9
source

Source: https://habr.com/ru/post/1669340/


All Articles