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-if一起使用的变量，如果不显示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>

等待完成的工作在vuejs中呈现组件

1 个答案: