repair_lite/front-end/src/components/user/User.vue

<template>
    <div class="user-avatar-dropdown">
        <Dropdown @on-click="handleClick">
            <Avatar :src="userAvatar"/>
            <Icon :size="18" type="md-arrow-dropdown"></Icon>
            <DropdownMenu slot="list">
                <DropdownItem name="logout">退出登录</DropdownItem>
            </DropdownMenu>
        </Dropdown>
    </div>
</template>

<script>
    import './user.less'

    export default {
        name: "User",
        props: {
            userAvatar: {
                type: String,
                default: ''
            }
        },
        methods: {
            handleLogOut(){
                this.$router.push({
                    name: 'login'
                })
            },
            logout () {
                this.handleLogOut();
            },
            handleClick (name) {
                switch (name) {
                    case 'logout': this.logout(); break
                    default: break
                }
            }
        }
    }
</script>

<style scoped>

</style>