等待工作完成呈現在vuejs

Question

我在這裏有一個色差分量，我需要先提出一個要求使用socket.io：

<template> 
    <h1>Don't show me before the socket's response</h1> 
</template> 

<script> 
    export default { 
     beforeCreate: function() { 
      let sessid = this.$cookie.get('sessid') 
      this.$options.sockets.logout = (data) => { 
       if (data.redirect) { 
        this.$router.push(data.redirect)  
       } else { 
        console.log('here, you can render the template') 
       } 
      } 
      this.$socket.emit('logout', { sessid }) 
     } 
    } 
</script> 

此代碼的工作，但它顯示在瀏覽器中的模板在重定向發生之前快速的一刻。

我想知道是否有等待套接字響應呈現模板的勾號。

Answer 1

您可以使用v-if，當插座響應到達，您可以設置可與使用的變量v，如果不顯示HTML中，類似以下內容：

<template> 
    <h1 v-if="sockResp">Don't show me before the socket's response</h1> 
</template> 

<script> 
    export default { 
     data: function() { 
      return { 
      sockResp: false 
      } 
     }, 
     beforeCreate: function() { 
      let sessid = this.$cookie.get('sessid') 
      this.$options.sockets.logout = (data) => { 
       if (data.redirect) { 
        this.$router.push(data.redirect)  
       } else { 
        console.log('here, you can render the template') 
        this.sockResp = true 
       } 
      } 
      this.$socket.emit('logout', { sessid }) 
     } 
    } 
</script>